活动公告当前位置:菲娱2 > 活动公告 > >

js 固定悬浮效果实现思路代码

  

[js,固定悬浮]js 固定悬浮效果实现思路代码

   代码如下:
  
  
(function($){  
var ele_fix = $("#div_right"); //浮动窗口  
var _main = $(".main"); //浮动区域  
var ele_offset_top = ele_fix.offset().top; //浮动区域高度  
$(window).scroll(function(){  
var 恒行平台官网 scro_top = $(this).scrollTop(); //当前高度  
var fix_foot_pos = parseInt(ele_fix.height())+parseInt(scro_top)-10; //浮动框最底部到最顶部高度  
var mainpos = parseInt(_main.offset().top)+parseInt(_main.height());  
if(scro_top <= ele_offset_top&&fix_foot_posele_fix.css({position: "static", top: -10});  
}else if(scro_top>ele_offset_top&&fix_foot_posele_fix.css({position: "fixed", top: -10});  
}else if(scro_top>ele_offset_top&&fix_foot_pos>mainpos){  
var posi = mainpos-fix_foot_pos-10;  
ele_fix.css({position: "fixed", top: posi});  
}  
});  
  
  
/*  
  
//方案二  
$(window).bind("scroll",function() {  
var temp = '1165';  
//判断往下滚  
if ($(document).scrollTop() > temp) { //如果大于这个高度,就置顶  
flag = false;  
$('#div_right').css({'position':'fixed', 'top':'-10px', 'margin-top':'0px'});  
}  
  
if ($(document).scrollTop() <= temp) { //如果小于这个高度,则恢复原来状态  
flag = true;  
$('#div_right').css('position','');  
}  
});  
  
  
*/  
  
})(jQuery);  
  

(责任编辑:admin)

上一篇:NodeJs模拟登陆正方教务

下一篇:onclick与listeners的执行先后问题详细解剖

推荐内容

客户服务热线

010-400-12345

在线客服