當前位置:
首頁 >
前端技术
> javascript
>内容正文
javascript
javascript广告漂浮效果代码
生活随笔
收集整理的這篇文章主要介紹了
javascript广告漂浮效果代码
小編覺得挺不錯的,現在分享給大家,幫大家做個參考.
javascript廣告漂浮效果代碼
本例主要是網頁漂浮廣告代碼,就是一個小框框在網頁里漂浮。這個網頁漂浮廣告的實現也很簡單,在網頁中通過javascript尋找id為img1的div,然后通過js代碼來實現網頁內的漂浮廣告。
很簡單的一個div,然后調用js.js去控制這個div
看網頁漂浮廣告代碼里js.js的代碼
<script type="text/javascript">var x=0;var y=0;var vx=1;var vy=1;//每次移動距離function move(){var pic=document.getElementById("pic");x=x+vx;y=y+vy;pic.style.left=x+"px";pic.style.top=y+"px";//如果x+圖片寬度大于窗口寬度或者x<0,反方向移動 if((x+pic.offsetWidth)>document.body.clientWidth||x<0){vx=-vx};if((y+pic.offsetHeight)>document.body.clientHeight||y<0){vy=-vy};}setInterval("move()",10);function shut(){document.body.removeChild(document.getElementById("pic"))}</script>請看html中的代碼
<body style="padding:0px;margin:0px;"><div id="pic" style="position:absolute"><img src="pc1.jpg" /><input type="button" value="關閉" style="position:absolute" onClick="shut()"></div></body>新手 請大神多指導
Deephug
總結
以上是生活随笔為你收集整理的javascript广告漂浮效果代码的全部內容,希望文章能夠幫你解決所遇到的問題。
- 上一篇: 在一起计时器_浅谈§1.4 实验:用打
- 下一篇: JS实现一个打点计时器