找回密码
 注册
楼主: 蓝雨
收起左侧

顶部大幅广告,N秒后自动消失 仿门户站大幅广告

  [复制链接]

5340

主题

8360

帖子

1万

积分

管理员

出售国内外虚拟空间

Rank: 10Rank: 10Rank: 10

积分
14731
帖子
8360
精华
67
体力
14731 点
蓝豆
2391 点
注册时间
2007-6-8

终身成就奖LY官方团队会员身份ID卡

发表于 2009-5-17 14:00:04 | 显示全部楼层 |阅读模式
模版文件header.html中找到
  1. </head>
复制代码

在上面加入以下代码:
游客,如果您要查看本帖隐藏内容请回复
出售国内或美国高性能虚拟空间,高速VPS以及服务器! 同时承接各种类型的网站制作,网站维护,支付宝交易安全放心!    联系QQ:6102031

5340

主题

8360

帖子

1万

积分

管理员

出售国内外虚拟空间

Rank: 10Rank: 10Rank: 10

积分
14731
帖子
8360
精华
67
体力
14731 点
蓝豆
2391 点
注册时间
2007-6-8

终身成就奖LY官方团队会员身份ID卡

 楼主| 发表于 2024-9-27 12:24:50 | 显示全部楼层
这个jquery特效总共有三种效果:

第一种为:顶部大图广告显示数秒后隐藏。也刷新,也就不再显示了。

第二种为:顶部大图广告显示数秒后隐藏。然后会出现一个重播的按钮。

第三种为:顶部大图广告显示数秒后隐藏。然后会显示一个小图。

有兴趣的可以仔细研究一下,demo只是其中一个小图的预览。像的显示时间等,图片大小都是可以自定义的。


  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  2. <html xmlns="http://www.w3.org/1999/xhtml">
  3. <head>
  4. <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  5. <title>顶部广告显示数秒后隐藏效果</title>
  6. <script src="http://libs.baidu.com/jquery/1.9.0/jquery.js"></script>
  7. <!--  第一种形式原广告显示数秒后隐藏  -->
  8. <!--<script type="text/javascript">
  9. $(document).ready(function(){
  10.        
  11.         $("#banner").slideDown("slow");               
  12. })
  13. function displayimg(){
  14.         $("#banner").slideUp("slow");   
  15.   }

  16.   setTimeout("displayimg()",15000);
  17.   
  18. </script>-->

  19. <!--  第二种形式原广告显示数秒后大板块隐藏,显示用来重播的标签  -->
  20. <!--<script type="text/javascript">
  21. $(document).ready(function(){
  22.        
  23.         $("#banner").slideDown("slow");               
  24.         $("#rightOpen").hide();
  25.        
  26.         $("#rightOpen").click(function(){
  27.                 $("#banner").slideDown("slow");
  28.                 setTimeout("displayimg()",15000);
  29.                 $("#rightOpen").hide();
  30.         })
  31. })
  32. function displayimg(){
  33.         $("#banner").slideUp("slow");   
  34.                 $("#rightOpen").show();  
  35.   }

  36.   setTimeout("displayimg()",15000);
  37.   
  38. </script>-->

  39. <!--  第三种形式原广告显示数秒后隐藏,展示小图  -->
  40. <script type="text/javascript">
  41. $(document).ready(function(){
  42.        
  43.         $("#banner").slideDown("slow");       
  44. })
  45. function displayimg(){
  46.         $("#banner").slideUp(1000,function(){
  47.                 $("#top").slideDown(1000);
  48.         })
  49.   }
  50.   setTimeout("displayimg()",1000);
  51. </script>
  52. </head>

  53. <body>
  54. <!--<div id="rightOpen" style="width:25px; height:275px; position:absolute; right:0px; top:0px;">重播</div>--><!--此注释的div为应用第二种js时所需要的内容,若用到第二种样式,请解除div的注释。里面的“重播”按钮可以为文字,也可以为图片。www.tonjay.com注-->
  55. <div id="top" style="display:none;"><img src="02.jpg" width="980" height="60" /></div><!--若用到第一种样式和第二种样式,此div可以删除。www.tonjay.com注-->
  56. <div id="banner" style="width:980px; height:291px; display:none;"><img src="01.jpg" width="980" height="291" /></div>
  57. </body>
  58. </html>
复制代码


出售国内或美国高性能虚拟空间,高速VPS以及服务器! 同时承接各种类型的网站制作,网站维护,支付宝交易安全放心!    联系QQ:6102031
懒得打字嘛,点击右侧快捷回复
您需要登录后才可以回帖 登录 | 注册

本版积分规则

关闭

网站公告上一条 /2 下一条

GMT+8, 2025-2-5 14:37 , Processed in 0.118449 second(s), 23 queries , Gzip On.

© 2006-2022 Powered by Discuz! X3.4

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