Rumah >hujung hadapan web >tutorial js >js melaksanakan kod pengiklanan di sudut kanan bawah dengan kesan penimbalan yang menatal dengan kemahiran screen_javascript
Contoh dalam artikel ini menerangkan pelaksanaan js kod pengiklanan di penjuru kanan sebelah bawah dengan kesan penimbalan yang menatal dengan skrin. Kongsikan dengan semua orang untuk rujukan anda. Butirannya adalah seperti berikut:
Kod pengiklanan di penjuru kanan sebelah bawah yang menatal secara automatik dengan skrin. Sila beri perhatian kepada beberapa parameter di sini:
id Id kandungan yang anda mahu tatal
Patutkah r diletakkan di sebelah kiri atau kanan? Lalai adalah kanan
t Kedudukan yang anda mahu letak pada halaman lalai ke tepi bawah, 0 adalah ke tepi atas
f 1 bermaksud tetap, tidak ditulis atau 0 bermaksud menatal (iaitu6 tetap tidak sah)
Adakah ia sangat praktikal? Versi ini telah disemak dua kali oleh pengarang dan mempunyai keserasian yang baik.
Tangkapan skrin kesan berjalan adalah seperti berikut:
Alamat demo dalam talian adalah seperti berikut:
http://demo.jb51.net/js/2015/js-right-buttom-float-follow-scroll-adv-codes/
Kod khusus adalah seperti berikut:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=gbk" /> <title>随屏幕滚动的带缓冲效果的右下角广告</title> <style> html,body{ height:2000px; } </style> </head> <body> <div id="aa" style="width:200px;height:200px;background:#c0c0c0;" >拖动滚动条试试哦~</div> </body> </html> <script> function scroll(p){ var d = document,w = window,o = d.getElementById(p.id),ie6 = /msie 6/i.test(navigator.userAgent); if(o){ o.style.cssText +=";position:"+(p.f&&!ie6?'fixed':'absolute')+";"+(p.r?'left':"right")+":0;"+(p.t!=undefined?'top:'+p.t+'px':'bottom:0'); if(!p.f||ie6){ -function(){ var t = 500,st = d.documentElement.scrollTop||d.body.scrollTop,c; c = st - o.offsetTop + (p.t!=undefined?p.t:(w.innerHeight||d.documentElement.clientHeight)-o.offsetHeight);//如果你是html 4.01请改成d.body,这里不处理以减少代码 c!=0&&(o.style.top = o.offsetTop + Math.ceil(Math.abs(c)/10)*(c<0?-1:1) + 'px',t=10); setTimeout(arguments.callee,t) }() } } } scroll({ id:'aa' }) </script>
Saya harap artikel ini akan membantu reka bentuk pengaturcaraan JavaScript semua orang.