如何制作网站右下角弹出广告(附代码)

2018-11-01    来源:学做网站论坛

容器云强势上线!快速搭建集群,上万Linux镜像随意使用

相信大家都有这样的经历,当我们在打开某一个网站的时候,在电脑屏幕的右下角会弹出来一个小广告窗口。如下图:

网站右下角弹出广告信息

这个是如何制作出来的呢?在我们学做网站过程中,也可能在我们自己的网站中做出这样的效果。

方法/步骤

  1. 在网页的底部</body>标签上方粘贴以下的HTML代码:(相关教程:什么是HTML?)
    
    
    <div id="rbbox"><a class="button" onclick="closeBox()">关闭</a><iframe src="https://www.xuewangzhan.com/" frameborder="0" height="200" width="300" scrolling="no"></iframe></div>
  2. 在</body>标签下方,粘贴以下的JS代码:
    
    
    <script language="javascript" type="text/javascript">
    window.onload=function(){showBox();setTimeout("closeBox()",5000)}
    function showBox(o){
    if (o==undefined) o=document.getElementById("rbbox");
    o.style.height=o.clientHeight+2+"px";
    if (o.clientHeight<200) setTimeout(function(){showBox(o)},5);
    }
    function closeBox(){document.getElementById("rbbox").style.display="none";}
    </script>
  3. 在网页头部标签</head>上面粘贴以下的CSS样式代码:
    
    
    <style type="text/css">
    #rbbox{position:absolute;right:0;bottom:0;width:300px;height:0px;overflow:hidden}
    .button{display:inline;float:right;font-size:12px;cursor:pointer}
    </style>
  4. 这样,网站右下角弹出广告效果就制作好了。

标签: isp 代码

版权申明:本站文章部分自网络,如有侵权,请联系:west999com@outlook.com
特别注意:本站所有转载文章言论不代表本站观点!
本站所提供的图片等素材,版权归原作者所有,如需使用,请与原作者联系。

上一篇:iframe标签用法详解

下一篇:搭建本地环境时启用启用服务器或者数据库失败的解决方法