jQuery插件实现控制网页元素动态居中显示
本文实例讲述了jQuery插件实现控制网页元素动态居中显示的方法。分享给大家供大家参考。具体实现方法如下：
(function($)
{
$.fn._center = function(self, parent, dimension)
{
if(!dimension.vertical && !dimension.horizontal)
return; //won't do anything anyway
if(parent)
parent = self.parent();
else
parent = window
self.css("position", "absolute");
if(dimension.vertical)
{
self.css("top", Math.max(0, (($(parent).height() - $(self).outerHeight()) / 2) +
$(parent).scrollTop()) + "px");
}
if(dimension.horizontal)
{
self.css("left", Math.max(0, (($(parent).width() - $(self).outerWidth()) / 2) +
$(parent).scrollLeft()) + "px");
}
return self;
};
$.fn.center = function(parent, args)
{
if(!args)
{
args = {horizontal: true, vertical: true};
}
return this.each(function()
{
var obj = $(this);
obj._center(obj, parent, args);
function callback()
{
obj._center(obj, parent, args);
}
callback();
$(window).resize(callback);
});
};
})(jQuery);
希望本文所述对大家的jQuery程序设计有所帮助。
-
本文向大家介绍jQuery插件jRumble实现网页元素抖动，包括了jQuery插件jRumble实现网页元素抖动的使用技巧和注意事项，需要的朋友参考一下 jRumble，它能让网页上的任意元素抖动起来，在你的网站中使用这个效果会有很大的机率吸引用户的注意力。此插件的效果可以用在链接上，或者div上，你可以设置抖动的范围、XY坐标、抖动幅度等。可设置为当鼠标移动上去抖动或者默认一直抖动，插件可定制
-
本文向大家介绍jQuery实现动态控制页面元素的方法分析，包括了jQuery实现动态控制页面元素的方法分析的使用技巧和注意事项，需要的朋友参考一下 本文实例讲述了jQuery实现动态控制页面元素的方法。分享给大家供大家参考，具体如下： 背景 最近做了一个小系统，其中需要在页面对用户的好友进行增删改查。本来没有那么复杂，用表格形式就可以相对容易的实现。 但是考虑到用户的体验度，首先添加尽量不想用输入
-
本文向大家介绍基于jQuery实现网页进度显示插件，包括了基于jQuery实现网页进度显示插件的使用技巧和注意事项，需要的朋友参考一下 相信大家都见过类似的网站功能，这种形式的进度显示可以很方便的让用户去理解和操作， 以下是插件的测试截图 ，提供了两个皮肤 使用js编写 可以灵活的生成进度条 方便进对一些工作进度进行图形显示 1、简单的调用 //所有步骤的数据 var stepListJson=[
-
本文向大家介绍jQuery控制元素隐藏和显示，包括了jQuery控制元素隐藏和显示的使用技巧和注意事项，需要的朋友参考一下 1、jQuery隐藏和显示效果 通过 jQuery，您可以使用 hide() 和 show() 方法来隐藏和显示 HTML 元素： 2、jQuery淡入淡出效果 通过 jQuery，您可以实现元素的淡入淡出效果。 jQuery 拥有下面四种 fade 方法： fadeIn()
-
本文向大家介绍jQuery实现元素的插入，包括了jQuery实现元素的插入的使用技巧和注意事项，需要的朋友参考一下 效果图： 图（1） 初始效果 图（2） 点击' 插入到此元素前面 '效果 代码如下： 以上就是本文的全部内容，希望本文的内容对大家的学习或者工作能带来一定的帮助，同时也希望多多支持呐喊教程！
-
本文向大家介绍jquery pagination插件动态分页实例(Bootstrap分页)，包括了jquery pagination插件动态分页实例(Bootstrap分页)的使用技巧和注意事项，需要的朋友参考一下 第一种Bootstrap -默认的分页实例，供大家参考，具体内容如下 第二个实例jquery pagination分页控件 分页效果： 源码：https://github.com/gb