javascript实现右下角广告框效果

本文教大家用原生射流研究…实现的简单网页主页右下角的广告框效果，利用好绝对定位，点击X关闭广告，里面的内容不管动图或者视频都可以。

代码最简洁，js行为优化版，复制粘贴即可使用。

演示部分

！DOCTYPE html html lang=' en ' head meta charset=' UTF-8 '标题右下角广告框效果/title/head style type=' text/CSS ' # adv box { width : 400 px；高度： 300像素位置：固定；右： 0；底部： 0；} .adv { width: 380px高度： 270像素；border: 1px实心# a00相对位置：} #图标{ display:块宽度： 24pxheight : 24 pxcolor : # 0c 0 font-size : 30px；字体粗细：更粗；绝对位置：right : 2pxtop : 2pxcursor :指针；} # resetadv { width: 105px高度：20 px位置：固定；right : 25pxbottom : 15pxcolor : # ffffffont-size : 20px；背景色： # 333;} .隐藏{ display:无}。显示{显示：块；}/style body div id=' adv box ' div class=' adv ' img src=' http : ' alt='结合html5，这可以是一个gif，swf或者视频span id=' icon ' x/span/div/div id=' resetadv '广告入口/div脚本类型=' text/JavaScript '(function(){//封装一下数字正射影像图的编号操作var $=function(id){返回文档。getelementbyid(id)；};//添加点击事件$("图标")。onclick=function(){ $('advbox ').class name=' hide }；$('resetadv ').onmouseover=function(){ $(' adv box ').{ show }；})();/脚本/正文/html以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持我们。