posfixed.js(修改为任意页面停靠)滚动固定jquery插件
来源:互联网 发布:java助理工程师要求 编辑:程序博客网 时间:2024/06/04 23:23
$(document).ready(function() {$("#ho-xdiv").posfixed({distance: 0, //top值,高度pos: "top",type: "while",hide: false});
js代码用于页面,也可写在js文件里。注意#ho-xdiv
posfixed.js代码如下:(修改过)
(function($){$.extend($.fn,{posfixed:function(configSettings){var settings={direction:"top",type:"while",hide:false,distance:0};$.extend(settings,configSettings);jQuery.browser={};(function(){jQuery.browser.msie=false;jQuery.browser.version=0;if(navigator.userAgent.match(/MSIE ([0-9]+)./)){jQuery.browser.msie=true;jQuery.browser.version=RegExp.$1}})();if($.browser.msie&&$.browser.version==6.0){$("html").css("overflow","hidden");$("body").css({height:"100%",overflow:"auto"})}var obj=this;var initPos=$(obj).offset().top;var initPosLeft=$(obj).offset().left;var anchoredPos=settings.distance;if(settings.type=="while"){if($.browser.msie&&$.browser.version==6.0){$("body").scroll(function(event){var objTop=$(obj).offset().top-$("body").scrollTop();if(objTop<=settings.distance){$(obj).css("position","absolute");$(obj).css("top",settings.distance+"px");$(obj).css("left",initPosLeft+"px")}if($(obj).offset().top<=initPos){$(obj).css("position","static")}})}else{$(window).scroll(function(event){if(settings.direction=="top"){var objTop=$(obj).offset().top-$(window).scrollTop();if(objTop<=settings.distance){$(obj).css("position","fixed");$(obj).css(settings.direction,settings.distance+"px")}if($(obj).offset().top<=initPos){$(obj).css("position","static")}}else{var objBottom=$(window).height()-$(obj).offset().top+$(window).scrollTop()-$(obj).outerHeight();if(objBottom<=settings.distance){$(obj).css("position","fixed");$(obj).css(settings.direction,settings.distance+"px")}if($(obj).offset().top>=initPos){$(obj).css("position","static")}}})}}if(settings.type=="always"){if($.browser.msie&&$.browser.version==6.0){if(settings.hide){$(obj).hide()}$("body").scroll(function(event){if($("body").scrollTop()>300){$(obj).fadeIn(200)}else{$(obj).fadeOut(200)}});$(obj).css("position","absolute");$(obj).css(settings.direction,settings.distance+"px");if(settings.tag!=null){if(settings.tag.obj!=null){if(settings.tag.direction=="right"){$(obj).css("left",(settings.tag.obj.offset().left+settings.tag.obj.width()+settings.tag.distance)+"px");$(window).resize(function(){$(obj).css("left",(settings.obj.tag.offset().left+settings.tag.obj.width()+settings.tag.distance)+"px")})}else{console.log(settings.tag.obj.offset().left-settings.tag.obj.width()-settings.tag.distance);$(obj).css("left",(settings.tag.obj.offset().left-$(obj).outerWidth()-settings.tag.distance)+"px");$(window).resize(function(){$(obj).css("left",(settings.tag.obj.offset().left-$(obj).outerWidth()-settings.tag.distance)+"px")})}}else{$(obj).css(settings.tag.direction,settings.tag.distance+"px")}}}else{if(settings.hide){$(obj).hide()}$(window).scroll(function(event){if($(window).scrollTop()>300){$(obj).fadeIn(200)}else{$(obj).fadeOut(200)}});var objLeft=$(obj).offset().left;$(obj).css("position","fixed");$(obj).css(settings.direction,settings.distance+"px");if(settings.tag!=null){if(settings.tag.obj!=null){if(settings.tag.direction=="right"){$(obj).css("left",(settings.tag.obj.offset().left+settings.tag.obj.width()+settings.tag.distance)+"px");$(window).resize(function(){$(obj).css("left",(settings.obj.tag.offset().left+settings.tag.obj.width()+settings.tag.distance)+"px")})}else{console.log(settings.tag.obj.offset().left-settings.tag.obj.width()-settings.tag.distance);$(obj).css("left",(settings.tag.obj.offset().left-$(obj).outerWidth()-settings.tag.distance)+"px");$(window).resize(function(){$(obj).css("left",(settings.tag.obj.offset().left-$(obj).outerWidth()-settings.tag.distance)+"px")})}}else{$(obj).css(settings.tag.direction,settings.tag.distance+"px")}}}}}})})(jQuery);
阅读全文
0 0
- posfixed.js(修改为任意页面停靠)滚动固定jquery插件
- jquery插件:任意位置浮动固定层
- jquery插件任意位置浮动固定层
- 【jQuery插件】-----页面滚动时动画wow.js
- Waypoints.js Javascript/jQuery 页面滚动监听插件
- jquery/js固定边栏滚动效果
- [收藏]jquery插件:任意位置浮动固定层
- (插件收藏)Progress.js – 为页面上的任意对象创建进度条效果
- jquery datatables插件兑现表头固定内容可滚动列表
- 导航菜单固定头部跟随屏幕滚动jQuery插件
- jquery实现页面无限滚动插件
- js滚动页面到固定位置进行操作
- jQuery全屏滚动插件fullPage.js
- jQuery全屏滚动插件fullPage.js
- jQuery全屏滚动插件fullPage.js
- jQuery全屏滚动插件fullPage.js演示
- jQuery全屏滚动插件fullPage.js
- jQuery全屏滚动插件fullPage.js
- 目标文件--以ELF文件为例对段简介
- 通达oa破解补丁|通达oa破解版|通达oa破解补丁下载
- redis主从
- Multiple dex files define Luk/co/senab/photoview/BuildConfig;
- LAMP安装(四) PHP安装(支持Ngnix)
- posfixed.js(修改为任意页面停靠)滚动固定jquery插件
- 超强手动扩栈方法
- 密码生成器+随机数生成器
- [绍棠_Swfit] 报错Command /Applications/Xcode.app/Contents/Developer/Toolchains/XcodeDefault.xctoolchain/
- MD5算法原理及其实现
- [后端][php]获取完整URL
- Warring the /usr/local/mysql/data directory is not owned by the 'mysql' or '_mysql' user
- 算法系列-topk问题
- 【Python】Python3 List copy()方法