手机
当前位置:查字典教程网 >编程开发 >Javascript教程 >基于javascript实现右下角浮动广告效果
基于javascript实现右下角浮动广告效果
摘要:本文实例为大家分享了基于javascript实现右下角浮动广告效果,供大家参考,具体内容如下效果图:具体代码:右下角广告代码window.o...

本文实例为大家分享了基于javascript实现右下角浮动广告效果,供大家参考,具体内容如下

效果图:

基于javascript实现右下角浮动广告效果1

具体代码:

<html> <head> <meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> <title>右下角广告代码</title> <script type="text/javascript"> window.onload = getMsg; window.onresize = resizeDiv; window.onerror = function(){} function $(id) {return document.getElementById(id);} //短信提示使用(asilas添加) var divT,divL,divW,divH,docH,docW,docST,docSL,objTimer,i = 0; function getMsg() { try{ divT = parseInt($("eMeng").style.top,10); //层top位置 divL = parseInt($("eMeng").style.left,10); //层left位置 divH = parseInt($("eMeng").offsetHeight,10);//层宽 divW = parseInt($("eMeng").offsetWidth,10);//层高 docW = document.documentElement.clientWidth;//窗口宽 docH = document.documentElement.clientHeight;//窗口高 docST=document.documentElement.scrollTop; docSL=document.documentElement.scrollLeft; $("eMeng").style.top = parseInt(docST,10) + docH + 10+"px"; $("eMeng").style.left = parseInt(docSL,10) + docW - divW+"px"; $("eMeng").style.visibility="visible"; objTimer = setInterval("moveDiv()",10); } catch(e){} } function resizeDiv() { try{ divH = parseInt($("eMeng").offsetHeight,10); divW = parseInt($("eMeng").offsetWidth,10); docW = document.documentElement.clientWidth; docH = document.documentElement.clientHeight; $("eMeng").style.top = docH - divH + parseInt(document.documentElement.scrollTop,10)+"px"; $("eMeng").style.left = docW - divW + parseInt(document.documentElement.scrollLeft,10)+"px"; } catch(e){} } function moveDiv() { try{ if(parseInt($("eMeng").style.top,10) <= (docH - divH + parseInt(document.documentElement.scrollTop,10))) { window.clearInterval(objTimer) objTimer = setInterval("resizeDiv()",1) } divT = parseInt($("eMeng").style.top,10); $("eMeng").style.top = divT - 1+"px"; } catch(e){} } function closeDiv() { $('eMeng').style.visibility='hidden'; if(objTimer) window.clearInterval(objTimer) } </script> <div id="eMeng"> <div> <div></div> </div> <div><a href="http://5.5fad.com/star/pur_detial.aspx" target="_blank"><img src="http://image.5fad.com/5/ad/ad01.jpg" width="225" height="164" border="0" /></a></div> </div> </body> </html>

希望本文所述对大家学习javascript程序设计有所帮助。

【基于javascript实现右下角浮动广告效果】相关文章:

基于jQuery插件实现环形图标菜单旋转切换特效

jQuery实现表格行上下移动和置顶效果

纯javascript实现四方向文本无缝滚动效果

基于JavaScript实现动态添加删除表格的行

jquery实现弹出层效果实例

用JavaScript实现页面重定向功能的教程

javascript基于DOM实现省市级联下拉框的方法

javascript实现在网页任意处点左键弹出隐藏菜单的方法

基于JavaScript实现图片点击弹出窗口而不是保存

JavaScript实现简单的数字倒计时

精品推荐
分类导航