PHPIN.NET

 找回密码
 立即注册
查看: 5368|回复: 0

[jQuery/Js/AJAX] 可关闭两边固定的对联广告代码jquery特效(宽屏才显示)

[复制链接]

469

主题

31

回帖

5569

积分

管理员

Rank: 9Rank: 9Rank: 9

积分
5569
发表于 2014-12-20 15:29:53 | 显示全部楼层 |阅读模式

马上注册,结交更多好友,享用更多功能,让你轻松玩转社区。

您需要 登录 才可以下载或查看,没有账号?立即注册

x
可关闭两边固定的对联广告代码jquery特效(宽屏才显示)

代码如下:
  1. <!DOCTYPE html>
  2. <html lang="zh-cn">
  3. <head>
  4. <meta charset="UTF-8" />
  5. <title>可关闭两边固定的对联广告代码jquery特效(宽屏才显示)</title>
  6. </head>
  7. <body>
  8. <style type="text/css">
  9. .dl_phpernote{top:6px;position:fixed;width:120px;overflow:hidden;display:none;border:1px solid #999;text-align:center;background-color:#CCC;display:none;}
  10. .dl_phpernote_left{left:6px;top:150px;}
  11. .dl_phpernote_right{right:6px;top:150px;}
  12. .dl_phpernote_con{width:100%;height:300px;overflow:hidden;border-bottom:1px solid #999;}
  13. .dl_phpernote_close{width:100%; height:24px;line-height:24px;font-size:13px; color:#555555;cursor:pointer;}
  14. </style>
  15. <div class="dl_phpernote dl_phpernote_left">
  16. <div class="dl_phpernote_con">对联的内容</div>
  17. <div class="dl_phpernote_close">关 闭</div>
  18. </div>
  19. <div class="dl_phpernote dl_phpernote_right">
  20. <div class="dl_phpernote_con">对联的内容</div>
  21. <div class="dl_phpernote_close">关 闭</div>
  22. </div>
  23. PHPIN.NET是帝国CMS爱好者支持站点,包括帝国CMS插件、帝国CMS模板、帝国CMS教程、帝国CMS二次开发、帝国CMS技巧、帝国CMS函数、帝国CMS文件解释、帝国CMS数据字典、平时累积收集的技巧手记等。PHPIN.NET为帝国CMS爱好者的站长建站提供建站动力,为帝国CMS爱好者分享共享资源。
  24. <p style="height:2000px;"></p>
  25. <script src="http://libs.baidu.com/jquery/1.8.3/jquery.min.js"></script>
  26. <script>
  27. $(function(){
  28. var window_w=$(window).width();
  29. if(window_w>1240){$("div.dl_phpernote").show();}
  30. $("div.dl_phpernote_close").click(function(){
  31. $(this).prev().animate({height:'0px'},200,function(){$(this).parent().hide();});
  32. return false;
  33. });
  34. });
  35. </script>
  36. </body>
  37. </html>
复制代码


效果截图:
效果演示.png
您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

QQ|Archiver|手机版|小黑屋|PHPIN.NET ( 冀ICP备12000898号-14 )|网站地图

GMT+8, 2024-11-23 17:38

Powered by Discuz! X3.4

Copyright © 2001-2021, Tencent Cloud.

快速回复 返回顶部 返回列表