<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title></title> <style type="text/css"> body,div{ margin:0; padding:0;} .box{ width:200px; height:60px; background-color:#c00;} </style> </head> <body> <div class="box"></div> <script>window.jQuery || document.write(unescape("%3Cscript src='http://libs.baidu.com/jquery/1.10.1/jquery.min.js' type='text/javascript'%3E%3C/script%3E")); </script> <script type="text/javascript"> jQuery.fn.center = function(){ this.css("position","absolute"); this.css("top", Math.max(0, (($(window).height() - $(this).outerHeight()) / 2) + $(window).scrollTop()) + "px"); this.css("left", Math.max(0, (($(window).width() - $(this).outerWidth()) / 2) + $(window).scrollLeft()) + "px"); return this; } $(".box").center(); </script> </body> </html>
效果图:
相关推荐
此前给大家推荐了一个纯css实现div容器内图片、文字上下居中的效果,缺点是采用了部分css3样式,兼容性较差,相关链接:纯css实现div容器内图片上下左右居中效果 今天特意在网上找到了一款插件--jquery.valign,可...
jQuery实现上下左右垂直居中是一款jquery.valign插件,可控制图片、文字在div容器内垂直上对齐、居中、底部对齐三种效果。
jQuery全屏页面滚动效果页面上下滚动效果代码jq插件
jq 验证码插件jq 验证码插件jq 验证码插件jq 验证码插件jq 验证码插件jq 验证码插件jq 验证码插件jq 验证码插件
jq年月日上下滑动选择日历插件兼容PC和移动端
jq实现页面的上下滑动效果是非常实用的,上下滑动翻页在实际的开发当中也是非常常见的
单图。多图查看,旋转,放大缩小 jq插件
jq 双日历插件日历选择器jq 双日历插件日历选择器jq 双日历插件日历选择器jq 双日历插件日历选择器jq 双日历插件日历选择器jq 双日历插件日历选择器jq 双日历插件日历选择器jq 双日历插件日历选择器jq 双日历插件...
jqURL地址处理插件 可以获取页面URL 点击新开一个200x200的google.com窗口 $.jqURL.loc('http://www.google.com',{w:200,h:200,wintype:'_blank'}); 点击获取页面URL地址 $.jqURL.url(); 点击获取页面URL...
jq左右移动切换 有按钮,jq左右移动切换 有按钮,jq左右移动切换 有按钮
最优秀的50个JQ插件最优秀的50个JQ插件最优秀的50个JQ插件最优秀的50个JQ插件最优秀的50个JQ插件最优秀的50个JQ插件
插件描述:JQ图片列表查看插件,兼容IE7及以上和其他浏览器,支持鼠标滚轮 参考示例:http://www.jq22.com/jquery-info5220
支持上下左右切换jQuery焦点图是一款图片九宫格排列,带上下左右四个箭头的jQuery焦点图代码。
插件描述:移动端左右滑动插件. 参考示例:http://www.jq22.com/jquery-info5051
jQuery 上下 左右 四方向 可控滚动 特效
jquery简单控制上下、左右四方向滚动的特效插件下载.rar
自己写的一个比较简单实用的轮播图插件,大家可以借鉴一下
这个Jar包里面包含许多好看实用的jqui插件
share分享,JQ第三方分享插件,可自定义链接、标题,移动端H5