jquery实现div垂直居中

<html>
<head>
<meta charset="UTF-8">
<title></title>
<script type="text/javascript" src="jquery.js"></script>
<style type="text/css">
#text1{width: 500px; border: 1px solid #ccc; height: 500px; margin: 0px auto }
.text2{float: left; border: 1px solid #ccc;width:40%;word-wrap:break-word;text-align:center;}
</style>
<script type="text/javascript">
$(function(){
$(".text2").middle();
});
(function( $ ){
$.fn.middle=function(){
return this.each(function(){
$top=(($(this).parent().height()-$(this).height()-2)/2)+"px";
$(this).css("marginTop",$top);
});
};
})( jQuery );
</script>
</head>
<body>
<div id="text1">
<div class="text2">22222222222222222222222222222222222222222222222222222222222222222222222222222222222222222222222222222222222
</div>
<div class="text2" style="float: right;">3333333333333333333333333333333333
</div>
</div>
</body>
</html>
jquery实现div垂直居中的更多相关文章
- 让div垂直居中于浏览器窗口
<style type="text/css"> div { position:absolute; top:50%; left:50%; margin ...
- div垂直居中的几种方法
CSS教程:div垂直居中的N种方法[转](原文地址:http://www.cnblogs.com/chuncn/archive/2008/10/09/1307321.html) 在说到这个问题的时候 ...
- jquery给div,Span, a ,button, radio 赋值取值
jquery给div的innerHTML赋值 $("#id").html()="test"; //或者 $("#id").html(&quo ...
- div垂直居中 css div盒子上下垂直居中
div垂直居中 css div盒子上下垂直居中,让DIV盒子在任何浏览器中任何分辨率的显示屏浏览器中处于水平居中和上下垂直居中. div垂直居中常用于单个盒子,如一个页面里只有一个登录布局,使用div ...
- div垂直居中的问题
工作和面试时常常会遇到怎么设置div垂直居中与浏览器中:包括固定宽高和不固定宽高的 1.固定宽高的div垂直居中 宽高固定的div很容易设置让其垂直居中 <div class="cen ...
- 由12306出错想到的div垂直居中的问题
今天想看看元旦回家还有没有余票,偷偷的打开了12306,开始查询回家的车票,结果发现,竟然查询不出来,再查直接出错了 看到这个很郁闷,很纠结,但是突然想到了最近一直想实现div垂直居中,赶紧试了一下1 ...
- jquery判断div是否显示或者隐藏
jquery判断div是否显示或者隐藏 很多时候会要判断一个div是不是显示着,没显示要怎么处理,显示的如何处理: 方法很简单,选择到你要判断的div,再用is(':hidden')判断是否隐藏:或者 ...
- jquery实现DIV层拖动
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
- JavaScript和JQuery获取DIV的值
1.设计源代码 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www ...
随机推荐
- ANCS协议翻译
综述 苹果通知中心(Apple Notification Center Service, ANCS)的目的是提供给蓝牙外设一种简单.方便的获取ios设备通知信息的方式. 依赖 ANCS的使用没有依赖, ...
- C#中的多线程使用 -- Thread 类详解(转)
现在C#已经建议摈弃使用 Suspend, Resume 暂停/恢复线程, 也尽量少用 Abort方法中断一个线程. 建议使用线程的同步手段有: Mutex.ManualResetEvent.Auto ...
- QJson 的使用
下载 源码解压 https://github.com/flavio/qjson 复制 src 目录下所有 .h .cpp .hh 文件到项目目录 qjson,pro 文件添加 INCLUDEPATH ...
- DDD的"waiting until GDB gets ready"
运行DDD调试器时,出现卡死现象,看软件状态,发现"waiting until GDB gets ready",Google了这个问题,很多都是删除文件夹"~/.ddd& ...
- inflate, findViewById与setContentView的区别与联系
protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentV ...
- JSP作为img的src时chrome的bug
废话不说,直接上代码. 新建一个jsp文件,名为img.jsp,代码如下: <%@page import="javax.imageio.ImageIO"%> <% ...
- ORACLE集合常用方法
集合方法pl/sql预定义了在varray 和嵌套表实例上进行调用的方法.这些方法能在集合上执行一定的功能. EXISTS 该函数返回集合中第一个元素的索引,如果集合为空,返回NULL Collect ...
- wampserver php 设置时间
php.ini 查找date.timezone = Europe/Paris 修改成亚洲地区 date.timezone = Asia/Shanghai
- UVA 1839 Alignment
还是最长上升子序列... 本题是求队列中任一士兵都能从左边或者右边看到队伍外: 即某一士兵左边为上升子序列,右边为下降子序列.求两个序列和,再用总数减去: #include <iostream& ...
- JS面向对象编程之:封装、继承、多态
最近在实习公司写代码,被隔壁的哥们吐槽说,代码写的没有一点艺术.为了让我的代码多点艺术,我就重新温故了<javascript高级程序设计>(其中几章),然后又看了<javascrip ...