fixedBox fixed div floating code menyokong kebanyakan penyemak imbas arus perdana di atas kemahiran ie6

Rumah

hujung hadapan web

tutorial js

fixedBox fixed div floating code menyokong kebanyakan penyemak imbas arus perdana di atas kemahiran ie6_javascript

May 16, 2016 pm 04:42 PM

terapung

&lt;!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"&gt;
&lt;html xmlns="http://www.w3.org/1999/xhtml"&gt;
&lt;head&gt;
&lt;meta http-equiv="Content-Type" content="text/html; charset=utf-8" /&gt;
&lt;title&gt;fixedBox&lt;/title&gt;
&lt;script id="xcore" type="text/javascript" src="http://www.haiqiancun.com/xWidget-0.1/xcore.js"&gt;&lt;/script&gt;
&lt;style&gt;
*{margin:0px;padding:0px;} body{height:3000px;}
&lt;/style&gt;
&lt;script&gt;
$(function() { $(".fixedBox").each(function() { 
var self = $(this); 
var id = self.attr("id") || 'fixedBox_' + Math.round(Math.random() * 100000); self.attr("id", id); 
var fb = $("#" + id); 
var mt = Math.floor(fb.css("margin-top").substring(2, 0)) || 0; 
var cd = $('&lt;div style="height:' + fb.outerHeight() + 'px;display:none;' + fb.attr("style") + '"&gt; &lt;/div&gt;'); fb.after(cd); fb.css({
'z-index': 999
}).data({
'top': fb.offset().top,
'left': fb.offset().left
}); $(window).scroll(function() { 
var pt = fb.data('top'); 
var pl = fb.data('left'); var st = $(document).scrollTop() - 10; 
var h = $(document).height(); 
if (st &gt; pt || st == pt) { cd.show(); 
if ((st + self.outerHeight()) &gt; h) { self.css({
position: 'fixed',
top: (h - (st + self.outerHeight()))
}); 
} else { self.css({
position: 'fixed',
top: 0 - mt
}); 
} 
} else { cd.hide(); self.css({
position: 'relative',
top: 0
}); 
} 
}) 
}) 
}) 
&lt;/script&gt;
&lt;/span&gt;
&lt;/head&gt;
&lt;body&gt;
&lt;div style="width:90%;margin:0px auto;"&gt;
&lt;div class="fixedBox" style="margin-top:50px; width:100%; overflow:hidden;background:#fff; font-size:12px;"&gt;
&lt;script&gt; $(function(){ $(".fixedBox").each(function(){ 
var self= $(this); var id = self.attr("id")||'fixedBox_'+Math.round(Math.random()*100000);
self.attr("id",id); var fb = $("#"+id); var mt = Math.floor(fb.css("margin-top").substring(2,0))||0;
var cd = $('&lt;div style="width:100%;height:'+fb.outerHeight()+'px;display:none;'+fb.attr("style")+'"&gt; &lt;/div&gt;');
fb.after(cd); fb.css({'z-index':999}).data({'top':fb.offset().top,'left':fb.offset().left});
$(window).scroll(function(){ var pt = fb.data('top'); var pl = fb.data('left');
var st = $(document).scrollTop()-10; var h = $(document).height(); if(st&gt;pt||st==pt){
cd.show(); if((st+self.outerHeight())&gt;h){ self.css({position:'fixed',top:(h-(st+self.outerHeight()))});
}else{ self.css({position:'fixed',top:0-mt}); } }else{ cd.hide(); self.css({position:'relative',top:0});
} }) }) }) &lt;/script&gt;
&lt;/div&gt;
例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例子例
&lt;/div&gt;
&lt;/body&gt;
 
&lt;/html&gt;

Salin selepas log masuk

Kenyataan Laman Web ini

Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn