當前位置：
首頁 >
前端技术
> javascript
>内容正文
javascript
前端javascript QQ右下角弹窗
生活随笔
收集整理的這篇文章主要介紹了
前端javascript QQ右下角弹窗
小編覺得挺不錯的,現在分享給大家,幫大家做個參考.
index.html
<!DOCTYPE html> <html lang="en"> <head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>騰訊首頁彈窗</title><style>body{height: 970px;margin: 0;padding: 0;}.ad{/* display:block; */position: fixed;bottom: 0;right: 0;width: 400px;height: 0px;/* border: 2px solid black; */}.btn{position: absolute;top: 0;right: 0;cursor: pointer;}.bg{width: 400px;}</style> </head> <body><iframe src="http://www.qq.com" width="100%" height="100%" frameborder="0"></iframe><div id="myAD" class="ad"><img id="myClose" class="btn" src="img/close.jpg" alt=""><a href="#"><img class="bg" src="img/0.jpg" alt=""></a></div> </body> <script>var myAD = document.getElementById("myAD");var myClose = document.getElementById("myClose");var adHeight = 0;myClose.onclick = function(){myAD.style.display = "none";}var show = setInterval(adShowFunc,20);function adShowFunc(){if(adHeight<225){adHeight +=2;myAD.style.height = adHeight + "px";//字符串} else{myAD.style.height = "225px";adHeight = 225;clearInterval(show);}}window.onload = function(){show = setInterval(adShowFunc,5);}總結
以上是生活随笔為你收集整理的前端javascript QQ右下角弹窗的全部內容，希望文章能夠幫你解決所遇到的問題。
- 上一篇： Linux系统中与网络配置相关的工具
- 下一篇： ibm存储管理软件 linux,IBM