当滚动到一定高度时,顶部固定不动

html:

 1 <div class="MYanshi" id="MYanshi_s">
 2   <div class="MYanshi_LOGO">
 3     <span class="MYanshi_L_span0"><img src="./img/yanshi/ys-logo.png" alt=""></span>
 4     <span class="MYanshi_L_span1">模版编号：S5174</span>
 5     <span class="MYanshi_L_span2">设计师：<i>sss</i></span>
 6     <div class="MYanshi_L_span5">
 7           <a href="" class="add-order">立即订购</a>
 8           <a id="j-tplpreview-order2" href="javascript:void(0)" onclick="" class="add-collect">加入收藏</a>
 9     </div>
10   </div>
11 
12   <div class="MYanshi_heder">
13     <div class="tplpreview-w-handler">
14         <div id="j-tplpreview-handler" class="tplpreview-handler">
15           <div class="expand">
16             <a id="j-tplpreview-expand" class="z" href="javascript:void(0);" title="收缩">收缩</a>
17          </div>
18           <div class="MB_Sh_LJGM order hide">
19             <a id="j-tplpreview-order2 " href="#" title="立即购买">立即购买</a>
20         </div>
21         </div>
22       </div>
23   </div>
24 </div>
25 <iframe id="ifr-tplpreview" src="http://family-102.view.websiteonline.cn/" j_load="http://family-102.view.websiteonline.cn/" frameborder="0" name="mainFrame" scrolling="yes" style="width:100%;"></iframe>

js:

 1 $(document).ready(function(){
 2 $("#j-tplpreview-expand").click(function(){//当点击触发silideToggle
 3   $(".MYanshi_LOGO").slideToggle("slow");
 4   $(".MB_Sh_LJGM").slideToggle("slow");
 5    $(".MB_Sh_LJGM").removeClass("hide");
 6   $(this).toggleClass("open"); return false;//触发后然后改变小图标方向，
 7 
 8   });
 9 });
10 
11 // 
12 // 模版展示导航浮动
13 $().ready(function(){
14     //导航距离屏幕顶部距离
15     var _defautlTop = $("#MYanshi_s").offset().top;//假如网速慢，或者页面较长加载较慢时，不能及时获取_defautlTop的值，导致回到页头时无法归位没找到好的解决方法，我增加了document.ready也不行，于是我就写死了这个值
16     //导航距离屏幕左侧距离
17     var _defautlLeft = $("#MYanshi_s").offset().left;
18     //导航默认样式记录，还原初始样式时候需要
19     var _position = $("#MYanshi_s").css('position');
20     var _top = $("#MYanshi_s").css('top');
21     var _left = $("#MYanshi_s").css('left');
22     var _zIndex = $("#MYanshi_s").css('z-index');
23     //鼠标滚动事件
24     $(window).scroll(function(){
25         if($(this).scrollTop() > _defautlTop){
26             //IE6不认识position:fixed，单独用position:absolute模拟
27             if($.browser.msie && $.browser.version=="6.0"){
28                 $("#top").css({'position':'absolute','top':eval(document.documentElement.scrollTop),'left':_defautlLeft,'z-index':99999});
29                 //防止出现抖动
30                 $("html,body").css({'background-image':'url(about:blank)','background-attachment':'fixed'});
31             }else{
32                 $("#MYanshi_s").css({'position':'fixed','top':0,'left':_defautlLeft,'z-index':99999});
33             }
34         }else{
35             $("#MYanshi_s").css({'position':_position,'top':_top,'left':_left,'z-index':_zIndex});
36         }
37     });
38 });