共享一个仿腾讯网购的可关闭的横幅广告

2016-07-07 16:03 来源：www.chinab4c.com 作者：ecshop专家



仿腾讯网购的模版马上要发布了 在此之前把这个可关闭横幅共享给大家 感谢您的支持原理很简单 希望能帮助到你 可能大家说见过 不过这个蛮简洁



首先是模版文件
  1. <!--如需隐藏文字和图片广告 请将display设置为none -->
  2. <div id="topnotice" class="wg_notice" style="display: block;">
  3. <i id="wg_notice_close" class="close" onClick="wg_notice_closes(this);"> </i>临近年关，因为各大快递公司放假原因，自2012年1月1日起，所有销售的商品暂时不能按照原定时间发货，对于给您带来的不便表示歉意。恢复的具体时间以后续网站公告为准。
  4. </div>
  5. <!--S AD -->
  6. <div id="topbanner" class="global_ad" style="display: block;">
  7. <div class="global_ad_close_wrap">
  8. <div id="global_ad_close">
  9. <a href="###" target="_blank" title="全站满199送300"><img src="images/tuiguang_bg.jpg" alt="全站
  10. 满 199送300" width="985" height="60"></a>
  11. <A class="global_ad_close" id="global_ad_close" onClick="global_ad_closes(this);" href="###" title="关闭" target=_self></A>
  12. </div>
  13. </div>
  14. </div>
  15. <!--E AD -->
复制代码



JS文件 可单独存入JS文件中在头部调用
  1. function global_ad_closes(global_ad_close)
  2. {
  3. document.getElementById("topbanner").style.display="none";
  4. }
  5. function wg_notice_closes(wg_notice_close)
  6. {
  7. document.getElementById("topnotice").style.display="none";
  8. }
复制代码



样式表
  1. .wg_notice i.close {background-image:url(images/module.png);background-repeat:no-repeat;}.wg_notice {width:943px;margin:0px auto 10px;padding:5px 30px 5px 10px;zoom:1;position:relative;border:1px solid #EACAA5;background-color:#FFFAE3;}.wg_notice i.close {font:300 16px/18px "\5B8B\4F53";position:absolute;width:10px;height:10px;overflow:hidden;top:9px;right:9px;background-position:-60px -140px;cursor:pointer;}.wg_notice a {color:#2C53A8;}.wg_notice a:hover {color:#d70000;}.global_ad_close {background-image:url(images/module.png);background-repeat:no-repeat;}.global_ad {width:985px;margin:0px auto;padding-bottom:15px;}.global_ad_close_wrap {position:relative;display:block;z-index: 2;}.global_ad_close {position:absolute;left:970px;top:4px;width:11px;height:11px;overflow:hidden;background-position:-100px -140px;cursor:pointer;}
复制代码


涉及到的图片下载
 module.rar (3.16 KB)

module.rar (3.16 KB)


回答：
沙发，效果不错，感谢分享

多谢LZ 分享。

清爽型 不错呢

不错。下来存着。

很好，收着，慢慢使用

不错正需要着，找了好久！

不错正需要着，找了好久！

路过看下，这个很不错！

效果很好，感谢楼主分享

好东西～！就等这个了～！感谢感谢～！

这个真不错，效果应该很好。。

支持共享