CSDN首页 空间 新闻 论坛 Blog 下载 读书 网摘 搜索 .NET Java 视频 接项目 求职 在线学习 买书 程序员 通知
可用分押宝游戏火热进行中... 专题改版:Java Web 专题
CSDN社区
搜索 收藏 打印 关闭
CSDN社区 >  Web 开发 >  JavaScript

分享一个自己写的小代码片段,CSDN首页有的一个效果

楼主Go_Rush(我的技术博客http://ashun.cnblogs.com/)2006-05-29 06:00:26 在 Web 开发 / JavaScript 提问

自从ie对flash的显示方式进行改变后,flash这个东西一下子变成了一个鸡肋。  
  许许多多的网站都撤掉了以前的flash动画,改用一段js程序来实现动画功能.  
   
  csdn首页也是如此。。我无聊,自己写了一个,特点如下:  
   
  1.对搜索引擎友好  
  2.对美工友好,因为数据和代码是分开的,完全不懂js的都可以用fontpage修改动画内容  
   
  可以把js代码保存为一个文件   然后<script   src="1.js"></script>,然后无须修改代码一个字母  
  就可以在多个页面中实现动画了  
   
   
  代码如下:  
   
  <style>  
  #g_div{text-align:right;overflow:hidden}  
  .b{width:24px;   height:16px;   background:#737373;   font-size:14px;   font-weight:bold;   color:#fff;   text-decoration:none;margin-left:1px}  
  .b:hover{width:24px;   height:16px;   background:#780001;   font-size:14px;   font-weight:bold;   color:#fff;   text-decoration:none;margin-left:1px}  
  .bhover{width:24px;   height:16px;   background:#780001;   font-size:14px;   font-weight:bold;   color:#fff;   text-decoration:none;margin-left:1px}  
  </style>  
   
  <div   id="g_div"   style="width:270px;height:252px"><a    
  href="#"   target=_blank><img    
  id="g_img"   style="FILTER:revealTrans(duration=1,transition=23);width:266px;height:220px;border:1px   green   solid"   src="http://zi.csdn.net/xian.gif">  
  </a><a    
  href="http://www.baidu.com/"   for="http://zi.csdn.net/xian.gif"     target="_blank">1.CSDN程序员</a><a    
  href="http://www.126.com/"   for="http://zi.csdn.net/microsoft280_187.jpg"     target="_blank">2.CSDN程序员</a><a    
  href="http://mp3.baidu.com/"     for="http://zi.csdn.net/live.gif"       target="_blank">3.CSDN程序员</a><a    
  href="http://post.baidu.com/"   for="http://zi.csdn.net/new-mba.gif"     target="_blank">4.CSDN程序员</a><a    
  href="http://top.baidu.com/"   for="http://zi.csdn.net/book.jpg"     target="_blank">5.CSDN程序员</a>  
  </div>  
   
  <script   language="JavaScript">  
  function   f(){  
  var   g_sec=3                     //几秒后切换图片  
  var   g_items=new   Array()  
  var   g_div=document.getElementById("g_div")    
  var   g_img=document.getElementById("g_img")    
  var   g_imglink=g_img.parentElement  
  var   arr=g_div.getElementsByTagName("A")  
  var   arr_length=arr.length  
  var   g_index=1  
   
  var   show_img=function(n){      
        if   (/\d+/.test(n)){  
  var   prev=g_index+1  
  g_index=n-1  
        }else{        
  var   prev=(g_index>arr.length)?(arr_length-1):g_index+1  
  g_index=(g_index<arr_length-2)?(++g_index):0  
        }    
        if   (document.all){  
        g_img.filters.revealTrans.Transition=23;  
      g_img.filters.revealTrans.apply();  
      g_img.filters.revealTrans.play();  
          }  
    arr[prev].className="b"      
    arr[g_index+1].className="bhover"  
    g_img.src=g_items[g_index].img.src  
    g_img.title=g_items[g_index].txt  
    g_imglink.href=g_items[g_index].url      
    g_imglink.target=g_items[g_index].target  
       
  }  
   
  for(var   i=1;i<arr_length;i++){  
  g_items.push({txt:arr[i].innerHTML,  
  url:arr[i].href,  
  target:arr[i].target,  
  img:(function(){var   o=new   Image;o.src=arr[i].getAttribute("for");return   o})()})    
  arr[i].title=arr[i].innerHTML  
  arr[i].innerHTML=[i,"&nbsp;"].join("")  
  arr[i].className="b"  
  arr[i].onclick=function(){  
  event.returnValue=false;  
  show_img(event.srcElement.innerText)  
  }  
  }  
  show_img(1)  
  var   t=window.setInterval(show_img,g_sec*1000)    
  g_img.onmouseover=function(){window.clearInterval(t)}  
  g_img.onmouseout=function(){t=window.setInterval(show_img,g_sec*1000)}      
  }  
   
  window.attachEvent("onload",f)    
  </script>  
   
   
   
  大家别见笑,完全是体力活,没什么技术含量,可能有谁能用得着,拿去用吧。  
   
  ps:只通过ie测试,我没有ff浏览器,不过肯定是不兼容ff的,要跨浏览器运行的自己可以修改修改  
  或者哪位高手有空闲,可以一起来完善兼容ff的部分.  
   
   
   
  顺便:  
          老规矩:  
                      散点分给大家 问题点数:200、回复次数:160Top

1 楼zt_soft(Get busy living, Or get busy dying.)回复于 2006-05-29 07:49:13 得分 0

ff上面测试没有成功哈   ,不过还是佩服楼主。最近开始用javascript,所以来逛逛,顺便接分。Top

2 楼xxqq0824(赛跑)回复于 2006-05-29 07:52:33 得分 0

markTop

3 楼cpio(备注)回复于 2006-05-29 07:57:26 得分 0

 
  我不知道为什么FLASH不好了  
   
   
  Top

4 楼ljlyy(亮亮)回复于 2006-05-29 08:02:11 得分 0

支持一下!!Top

5 楼mingxuan3000(铭轩)回复于 2006-05-29 08:06:30 得分 0

支持一下!!  
  楼主散的分多呀Top

6 楼liuph3000()回复于 2006-05-29 08:29:02 得分 0

顶一个Top

7 楼jiangtao088(不够专业)回复于 2006-05-29 08:40:37 得分 0

顶一下!Top

8 楼woneinwy(★★★★★★★★★★@しǒひê)回复于 2006-05-29 09:09:38 得分 0

支持!!!  
  顺便试一下  
  顺便接点分  
  顺便祝楼主早日找到工作  
  顺便寒自己一下Top

9 楼youxu_you(爱蓝)回复于 2006-05-29 09:24:50 得分 0

支持一下,初学者看不太懂Top

10 楼lymzyc(豆豆)回复于 2006-05-29 09:33:11 得分 0

来接点分,顺便学习下Top

11 楼eglic(圪圪) (理由永远是谎言,信仰永远是自慰)回复于 2006-05-29 09:35:28 得分 0

牛XTop

12 楼underone(再看抽你小丫的)回复于 2006-05-29 09:36:04 得分 0

学习Top

13 楼secondflying(金乌贼)回复于 2006-05-29 09:41:32 得分 0

好东西,可以用来让我们初学者学习哈!!!Top

14 楼scsjs(闪电回归)回复于 2006-05-29 09:49:09 得分 0

UP   &&   接分Top

15 楼kagomelee(卡通fans)回复于 2006-05-29 09:49:27 得分 0

呵呵   感谢楼主啊!现在   用JS   来实现动态显示图片的却是多了啊。。。Top

16 楼vincentmax(天地任逍遥)回复于 2006-05-29 10:09:56 得分 0

接分Top

17 楼fzlotuscn(无为一本)回复于 2006-05-29 11:07:01 得分 0

学习Top

18 楼tokyo3th()回复于 2006-05-29 11:11:21 得分 0

接分Top

19 楼szh3210(/+/=〆)回复于 2006-05-29 11:18:57 得分 0

学习Top

20 楼xuzuning(唠叨)回复于 2006-05-29 11:24:57 得分 0

不错Top

21 楼Psyche_ks(曹鸿涛)回复于 2006-05-29 11:55:01 得分 0

学习  
  Top

22 楼mindon(麦盾@深圳)回复于 2006-05-29 11:59:59 得分 0

flash也改了,有个swfobject   的东西……Top

23 楼cambridgeboy(水木工作室)回复于 2006-05-29 12:20:02 得分 0

不错  
  Top

24 楼TCat(蚊子)回复于 2006-05-29 12:28:40 得分 0

搂猪,做的不错!Top

25 楼xb90110()回复于 2006-05-29 12:32:35 得分 0

希望楼主这样的人能多一些,多多学习!Top

26 楼net205(人不可以无耻到这种地步)回复于 2006-05-29 12:37:17 得分 0

不错,支持下  
  以前想写这么个东西,懒,没写。。  
  收藏,,有用Top

27 楼fengyeng(在城里飘~~~~)回复于 2006-05-29 12:38:05 得分 0

支持一下!Top

28 楼robake(Roback)回复于 2006-05-29 12:43:30 得分 0

学习!Top

29 楼Sandy945(阿非)回复于 2006-05-29 12:44:39 得分 0

upTop

30 楼slawdan(select 大便 from 粪池 where 蛆数<10)回复于 2006-05-29 12:48:56 得分 0

学习,接分~Top

31 楼guojh021(赚钱买枪抢银行)回复于 2006-05-29 13:07:47 得分 0

学习,接分~  
  Top

32 楼universes(及时揭帖是一种美德 | CSDN也这么黑)回复于 2006-05-29 13:08:30 得分 0

mark  
  Top

33 楼strutsdbk(你幸福我快乐)回复于 2006-05-29 13:26:22 得分 0

http://blog.csdn.net/strutsdbk/archive/2006/05/28/758388.aspxTop

34 楼tianshul8(闲耘) (HoToo.cn)回复于 2006-05-29 13:32:17 得分 0

糊涂一戳Top

35 楼samjuly()回复于 2006-05-29 13:42:59 得分 0

支持原创Top

36 楼lightninga()回复于 2006-05-29 13:44:04 得分 0

支持一下。Top

37 楼cuizhanjun1981(城市稻草人)回复于 2006-05-29 13:54:57 得分 0

jfTop

38 楼sualang(魔力封印)回复于 2006-05-29 13:57:14 得分 0

upTop

39 楼xjjdanran(何流)回复于 2006-05-29 14:01:36 得分 0

学习,谢谢楼主Top

40 楼dgrwang(探索者)回复于 2006-05-29 14:03:35 得分 0

jfTop

41 楼intereye(面朝大海,春暖花开)回复于 2006-05-29 14:14:42 得分 0

不错~~8过兼容性差了点~~  
  我最近也在研究这东西~~  
  PS:接分!Top

42 楼norwolfli(烟灰)回复于 2006-05-29 14:22:46 得分 0

专业接分!Top

43 楼cestar2005(往事随风)回复于 2006-05-29 14:29:53 得分 0

不错...Top

44 楼sunsuny(陽光之子)回复于 2006-05-29 15:03:24 得分 0

好,不错  
  顺便接分Top

45 楼f00tz()回复于 2006-05-29 15:30:49 得分 0

upTop

46 楼xp_cmdshell(小三)回复于 2006-05-29 16:19:02 得分 0

恩,凑个热闹,,一窍不通,,观望`~`~`~Top

47 楼kjeny2002(小杭)回复于 2006-05-29 16:19:46 得分 0

好多分呀。。。。Top

48 楼starsky0(44)回复于 2006-05-29 16:25:01 得分 0

帮楼主顶,顺便接分.Top

49 楼fredlin(.net)回复于 2006-05-29 16:41:55 得分 0

自从ie对flash的显示方式进行改变后???  
  自从ie对flash的显示方式进行改变后??  
  ---  
  怎么改了?改成什么样了?   不明白呢?谁指点一下Top

50 楼adaailpll()回复于 2006-05-29 16:50:09 得分 0

markTop

51 楼bufan2162(永远保持前进状态)回复于 2006-05-29 17:14:00 得分 0

楼主乃大好人也Top

52 楼canserly(没啥不好意思)回复于 2006-05-29 17:36:28 得分 0

先MARK再看  
  Top

53 楼ProgramFuny(Leecome)回复于 2006-05-29 19:52:31 得分 0

学习Top

54 楼billow_chentao(巨浪)回复于 2006-05-29 20:21:56 得分 0

不懂Top

55 楼love01px(JAVA CUP)回复于 2006-05-29 20:22:26 得分 0

UPTop

56 楼jspadmin(阿笨狗http://www.pifoo.com域名空间专卖cn20、com50元)回复于 2006-05-29 20:44:48 得分 0

呵呵Top

57 楼czq9966(宁录)(毛主席领导咱闹革命……)回复于 2006-05-29 20:50:55 得分 0

UPTop

58 楼pcown(pcown)回复于 2006-05-29 21:43:58 得分 0

MarkTop

59 楼DeluxWorld(曾经的你)回复于 2006-05-29 22:02:17 得分 0

接分~Top

60 楼xxxl()回复于 2006-05-29 22:10:47 得分 0

upTop

61 楼adstao()回复于 2006-05-29 22:14:24 得分 0

安逸,顶!Top

62 楼marcian(marcian)回复于 2006-05-29 23:08:22 得分 0

flash变成鸡肋?有意思。Top

63 楼malaxy(银河)回复于 2006-05-30 00:48:04 得分 0

怎么我把它加入了<html>楼主的代码<body></body></html>用ie浏览了没有改变图片  
  ???????????????  
  哪位高手指点一下菜鸟Top

64 楼sakura_plus(忘了伤心的事吧..谁帮找点好玩的项目研究研究~~~~将来找个程序员...)回复于 2006-05-30 01:18:22 得分 0

不懂啊不懂了.........Top

65 楼jobs002(Oh! Office)回复于 2006-05-30 08:28:28 得分 0

接分..Top

66 楼acejun(每天收获一点点...)回复于 2006-05-30 08:32:41 得分 0

谢谢,要研究研究。Top

67 楼netdust(静时常思己过,闲谈勿论人非)回复于 2006-05-30 08:47:21 得分 0

jfTop

68 楼wengnet(西门吹雪)回复于 2006-05-30 08:51:53 得分 0

象楼主这样的好人,真是越来越多了~!Top

69 楼i33333(HONESTYWHITELIE)回复于 2006-05-30 09:07:15 得分 0

up`Top

70 楼Mapleleaf123(为分而努力)回复于 2006-05-30 09:11:03 得分 0

8错Top

71 楼dgrwang(探索者)回复于 2006-05-30 09:12:10 得分 0

好贴Top

72 楼min_jie(止戈)回复于 2006-05-30 09:13:38 得分 0

先放着。。Top

73 楼yjbnew(伟大的光荣的正确的ASP千岁千岁千千岁)回复于 2006-05-30 09:14:15 得分 0

markTop

74 楼hank212(IT民工)回复于 2006-05-30 09:18:30 得分 0

不错不错Top

75 楼feettrace(feettrace)回复于 2006-05-30 09:21:21 得分 0

哈哈,看不懂,不为别的,为分来了Top

76 楼zwrtv(蝙蝠)回复于 2006-05-30 09:22:06 得分 0

收藏Top

77 楼fengruzhuo(傻大木)回复于 2006-05-30 09:23:33 得分 0

收藏,接分Top

78 楼rabbitweng(wsq)回复于 2006-05-30 09:24:55 得分 0

markTop

79 楼Ryo_Hazuki(困了)回复于 2006-05-30 09:27:48 得分 0

不错Top

80 楼wdx1632(lg)回复于 2006-05-30 09:45:52 得分 0

收藏多谢!Top

81 楼unliker(<简码>庙小无僧风扫地,天高月明佛前灯。)回复于 2006-05-30 09:49:41 得分 0

markTop

82 楼lk919(修改你在CSDN社区的信息)回复于 2006-05-30 09:49:42 得分 0

不错  
  Top

83 楼chenxi0516(一个很难学会东西的人)回复于 2006-05-30 10:11:23 得分 0

顶~Top

84 楼luoshuigufan(luoshuigufan)回复于 2006-05-30 10:26:24 得分 0

试过了。顶。。Top

85 楼erikyan()回复于 2006-05-30 10:27:07 得分 0

支持加顶!!!Top

86 楼jyj910(追寻生活)回复于 2006-05-30 10:29:01 得分 0

下了再试。Top

87 楼fantiny(卖身不卖艺的菜鸟)回复于 2006-05-30 10:43:36 得分 0

支持Top

88 楼Teng_s2000(分涨的太慢,升星难啊!!)回复于 2006-05-30 10:46:31 得分 0

UPTop

89 楼LighBlade(菜鸟加加油!!!)回复于 2006-05-30 10:55:48 得分 0

Good!Top

90 楼hop___(茫然)回复于 2006-05-30 11:34:58 得分 0

 
            谢谢,已收藏!Top

91 楼Reeezak(坚持信念)回复于 2006-05-30 11:37:01 得分 0

不搜藏不行啊~~~  
  hohoTop

92 楼mazhiyuan1981(马志远)回复于 2006-05-30 12:39:30 得分 0

不错啊.  
   
  <style>  
  #g_div{text-align:right;overflow:hidden}  
  .b{width:24px;   height:16px;   background:#737373;   font-size:14px;   font-weight:bold;   color:#fff;   text-decoration:none;margin-left:1px}  
  .b:hover{width:24px;   height:16px;   background:#780001;   font-size:14px;   font-weight:bold;   color:#fff;   text-decoration:none;margin-left:1px}  
  .bhover{width:24px;   height:16px;   background:#780001;   font-size:14px;   font-weight:bold;   color:#fff;   text-decoration:none;margin-left:1px}  
  </style>  
   
  <div   id="g_div"   style="width:270px;height:252px"><a    
  href="#"   target=_blank><img    
  id="g_img"   style="FILTER:revealTrans(duration=1,transition=23);width:266px;height:220px;border:1px   green   solid"   src="http://zi.csdn.net/xian.gif">  
  </a><a    
  href="http://www.baidu.com/"   for="http://zi.csdn.net/xian.gif"     target="_blank">1.CSDN程序员</a><a    
  href="http://www.126.com/"   for="http://zi.csdn.net/microsoft280_187.jpg"     target="_blank">2.CSDN程序员</a><a    
  href="http://mp3.baidu.com/"     for="http://zi.csdn.net/live.gif"       target="_blank">3.CSDN程序员</a><a    
  href="http://post.baidu.com/"   for="http://zi.csdn.net/new-mba.gif"     target="_blank">4.CSDN程序员</a><a    
  href="http://top.baidu.com/"   for="http://zi.csdn.net/book.jpg"     target="_blank">5.CSDN程序员</a>  
  </div>  
   
  <script   language="JavaScript">  
  function   f(){  
  var   g_sec=3                     //几秒后切换图片  
  var   g_items=new   Array()  
  var   g_div=document.getElementById("g_div")    
  var   g_img=document.getElementById("g_img")    
  var   g_imglink=g_img.parentElement  
  var   arr=g_div.getElementsByTagName("A")  
  var   arr_length=arr.length  
  var   g_index=1  
   
  var   show_img=function(n){      
        if   (/\d+/.test(n)){  
  var   prev=g_index+1  
  g_index=n-1  
        }else{        
  var   prev=(g_index>arr.length)?(arr_length-1):g_index+1  
  g_index=(g_index<arr_length-2)?(++g_index):0  
        }    
        if   (document.all){  
        g_img.filters.revealTrans.Transition=23;  
      g_img.filters.revealTrans.apply();  
      g_img.filters.revealTrans.play();  
          }  
    arr[prev].className="b"      
    arr[g_index+1].className="bhover"  
    g_img.src=g_items[g_index].img.src  
    g_img.title=g_items[g_index].txt  
    g_imglink.href=g_items[g_index].url      
    g_imglink.target=g_items[g_index].target  
       
  }  
   
  for(var   i=1;i<arr_length;i++){  
  g_items.push({txt:arr[i].innerHTML,  
  url:arr[i].href,  
  target:arr[i].target,  
  img:(function(){var   o=new   Image;o.src=arr[i].getAttribute("for");return   o})()})    
  arr[i].title=arr[i].innerHTML  
  arr[i].innerHTML=[i,"&nbsp;"].join("")  
  arr[i].className="b"  
  arr[i].onclick=function(){  
  event.returnValue=false;  
  show_img(event.srcElement.innerText)  
  }  
  }  
  show_img(1)  
  var   t=window.setInterval(show_img,g_sec*1000)    
  g_img.onmouseover=function(){window.clearInterval(t)}  
  g_img.onmouseout=function(){t=window.setInterval(show_img,g_sec*1000)}      
  }  
   
  window.attachEvent("onload",f)    
  </script>Top

93 楼mail25(■游荡在北四环■)回复于 2006-05-30 12:55:08 得分 0

markTop

94 楼mmmcd(超超)回复于 2006-05-30 13:07:34 得分 0

支持楼主Top

95 楼jinfeng003(靳奉山)回复于 2006-05-30 13:09:14 得分 0

3Q  
  楼主厉害~~~Top

96 楼Gummy()回复于 2006-05-30 13:10:33 得分 0

markTop

97 楼fellowcheng(鹰击长空)回复于 2006-05-30 13:36:59 得分 0

呵呵,支持Top

98 楼mylover002(靠近您,温暖我!)回复于 2006-05-30 13:39:28 得分 0

good,thanksTop

99 楼posemanboy(奇货可居)回复于 2006-05-30 13:45:13 得分 0

支持Top

100 楼y7967(三千)回复于 2006-05-30 13:46:17 得分 0

支持,我刚做了一个读取xml文件的,类似效果的Flash~Top

101 楼ccs02287(☆兜兜里有糖☆偶滴兜兜里有糖,你和我玩不?)回复于 2006-05-30 14:24:35 得分 0

学习ING!  
  UP  
  接分!Top

102 楼sunhudong(lucker挑战者)回复于 2006-05-30 14:32:11 得分 0

值得学习Top

103 楼boylez(boylez)回复于 2006-05-30 14:37:36 得分 0

niu!Top

104 楼iasky(iasky)回复于 2006-05-30 14:41:12 得分 0

学习Top

105 楼laohuchiren(桌子凳子)回复于 2006-05-30 14:44:44 得分 0

学习  
  Top

106 楼babyxu(xubo)回复于 2006-05-30 14:45:36 得分 0

学习一下。顺便接分Top

107 楼Arqui(我要吃饭)回复于 2006-05-30 14:56:34 得分 0

JF   jfTop

108 楼mars_net(企鹅)回复于 2006-05-30 15:30:03 得分 0

呵呵.幫摟住測試一下Top

109 楼zcy_shenyang825135(小知)回复于 2006-05-30 15:52:53 得分 0

学习Top

110 楼darklight2008(其实我是水瓶座)回复于 2006-05-30 16:00:08 得分 0

mark................................Top

111 楼doublefish8133(米兰王朝)回复于 2006-05-30 16:19:49 得分 0

8错   也许有用哈   谢谢拉!~Top

112 楼cuteant(我这张旧床票还能否登上你的破床|涛声是否依旧)回复于 2006-05-30 16:25:18 得分 0

支持Top

113 楼meizz(梅花雪)回复于 2006-05-30 17:21:36 得分 0

核心:FILTER:revealTrans(duration=1,transition=23);   一个IE滤镜,  
   
  楼主你可以把这个做得更完美些,比如在其它的非IE浏览器虽然不支持这个滤镜,但是支持透明滤镜的,你可以分一下,IE下继续使用你这个效果,而在非IE浏览器下用透明滤镜:  
   
  style.opacity  
  opacity   =   0.5           CSS3  
   
  style.MozOpacity  
  -moz-opacity:   0.5               Mozilla   里等同上面这个滤镜     这个滤镜也适用于Netscape  
   
  style.KHTMLOpacity  
  -khtml-opacity:   0.5           Safari     里的透明滤镜。  
   
  IE:  
  obj.filters.alpha.opacityTop

114 楼strawren(大漠)回复于 2006-05-30 17:32:14 得分 0

meizz(梅花雪)   (   )   信誉:709    
   
  还有一级钻石的级别啊?Top

115 楼wakin528()回复于 2006-05-30 17:53:41 得分 0

学习Top

116 楼cleansunshing(努力学习中)回复于 2006-05-30 18:22:00 得分 0

接分Top

117 楼njlrg(阿波罗18船主)回复于 2006-05-30 19:07:38 得分 0

好,顶一下!  
   
  收藏,有用。Top

118 楼computerclass(leovo)回复于 2006-05-30 20:18:55 得分 0

收藏,有用。  
  Top

119 楼laoyue213(非常悠闲)回复于 2006-05-30 22:25:27 得分 0

分不多了,来这里打工赚点外块^_^Top

120 楼Go_Rush(我的技术博客http://ashun.cnblogs.com/)回复于 2006-05-30 23:15:51 得分 0

核心:FILTER:revealTrans(duration=1,transition=23);   一个IE滤镜  
  楼主你可以把这个做得更完美些,比如在其它的非IE浏览器虽然不支持这个滤镜,但是支持透明滤镜的,你可以分一下,IE下继续使用你这个效果,而在非IE浏览器下用透明滤镜:  
  style.opacity  
   
   
  to   meizz(梅花雪)  
  其实我想过你那个问题的。但是透明   opacity   这个他不是一个渐变的过程。  
  一般这种图片过度特效最多持续一秒把,最多最多两秒   duration=2  
  超过2秒就很累赘,喧宾夺主了。  
  在2秒钟里面实现  
    g_img.style.filter="alpha(opacity="+i+")"       透明度的变化是比较累赘的事情。  
  要用   window.setInterval     改变   i   的值,   而且还要调用几十上百次window.setInterval  
  才能看到效果。  
  这样的话,我觉得得不赔失,是为了特效而特效了  
   
   
  另外一种考虑是,毕竟非ie浏览器是少数,即使在ff下   没有图片过度特效,其实也没什么,  
  还是很流畅,不过就是看不到ie里面的美而已。Top

121 楼Go_Rush(我的技术博客http://ashun.cnblogs.com/)回复于 2006-05-30 23:20:56 得分 0

to   meizz(梅花雪)  
   
  能否麻烦你开个新贴,总结一下ie   和   ff下编程的不同处理方式啊。。  
  我对firefox理解不是很多,掌握的一些跨浏览器兼容的知识也比较零散。。  
   
  你要是能有时间出一个类似   javascript   in   ff   &&   ie   的汇总贴,那真是js版之福了  
   
   
  我这几天都在忙店里面生意,只有晚上10:00后才有时间搞搞程序,比较郁闷,  
  等我女朋友回来了我就有时间研究程序了,到时候把这个代码改改,让他兼容ff  
  Top

122 楼sjb_dl(飞火流星)回复于 2006-05-31 06:47:04 得分 0

没来晚吧,哈哈Top

123 楼TERRYYRRET(命运)回复于 2006-05-31 07:34:52 得分 0

接分Top

124 楼bin95(xcvxcv)回复于 2006-05-31 08:49:21 得分 0

学习中Top

125 楼meizz(梅花雪)回复于 2006-05-31 09:08:00 得分 0

Go_Rush(阿舜)   opacity   的取值是   0-100   你的步长可以设大点呀。比如是5,比如是10。还可以这样老图片隐去,同时新图片显示,即如MSN或者QQ的迷你首页切换一样的效果!Top

126 楼elivehai(一切皆有可能)回复于 2006-05-31 09:14:22 得分 0

学习下。Top

127 楼net205(人不可以无耻到这种地步)回复于 2006-05-31 15:35:58 得分 0

你要是能有时间出一个类似   javascript   in   ff   &&   ie   的汇总贴,那真是js版之福了  
   
  --------------------支持,我也希望得到牛人的总结......Top

128 楼fredlin(.net)回复于 2006-06-02 13:56:09 得分 0

自从ie对flash的显示方式进行改变后??  
  ---  
  怎么改了?改成什么样了?什么意思啊!!!!  
  怎么改了?改成什么样了?什么意思啊!!!!  
  怎么改了?改成什么样了?什么意思啊!!!!  
  怎么改了?改成什么样了?什么意思啊!!!!  
  怎么改了?改成什么样了?什么意思啊!!!!Top

129 楼Go_Rush(我的技术博客http://ashun.cnblogs.com/)回复于 2006-06-02 14:26:08 得分 0

楼上的,你baidu一下:     "单击以激活此控件"Top

130 楼qqulijun(探讨中国软件)回复于 2006-06-03 10:00:10 得分 0

感谢楼主!Top

131 楼jiaoniang(51j)回复于 2006-06-03 10:12:18 得分 0

收藏下Top

132 楼mg365(MG365.NET)回复于 2006-06-03 10:40:04 得分 0

我也支持一下。接分Top

133 楼zhuangyan2004(庄严)回复于 2006-06-03 10:48:09 得分 0

很早就用这种效果,但是看了这个帖子后才知道原理是什么样子的.  
  谢谢啊!Top

134 楼nosuchtracter(极品拖拉机)回复于 2006-12-09 21:20:14 得分 0

楼主好人啊Top

135 楼gamemast()回复于 2006-12-09 21:25:38 得分 0

学习Top

136 楼meizz(梅花雪)回复于 2006-12-18 10:51:47 得分 0

http://www.csdn.net/ui/adrotate.htmTop

137 楼yueliangdao0608((深圳PHPER.MSN:yueliangdao0608@gmail.com)回复于 2006-12-18 11:07:47 得分 0

显示不太好。我这边  
  Top

138 楼Anewczs(Anew)回复于 2006-12-18 11:23:35 得分 0

散吧  
  SanbaTop

139 楼ss3idx()回复于 2006-12-18 13:08:10 得分 0

顶啊...学习Top

140 楼wangguan_xd(王冠)回复于 2006-12-19 16:49:11 得分 0

真的很不错,多谢啦!Top

141 楼yyy431706(观兰)回复于 2006-12-19 17:13:48 得分 0

好东西Top

142 楼czq9966(宁录)(毛主席领导咱闹革命……)回复于 2006-12-19 18:27:53 得分 0

upTop

143 楼hurrayboy()回复于 2006-12-19 23:50:40 得分 0

收藏啦...Top

144 楼lixin1020(ffffff)回复于 2006-12-20 09:17:56 得分 0

HAO   收藏Top

145 楼no1kwl(\-@-@-/)回复于 2006-12-21 11:28:24 得分 0

不错不错.来接点分Top

146 楼webmm(一笑而过)回复于 2006-12-21 11:57:07 得分 0

又见散分贴,厚道啊,接~~~~Top

147 楼muxrwc(厕所宣言:信念永不变,追猫永不弃。)回复于 2006-12-21 13:31:21 得分 0

UP。。。Top

148 楼fusoft(黑马)回复于 2006-12-21 17:33:42 得分 0

我接!Top

149 楼xzhiwei(大熊,www.itbar8.com,bbs.itbar8.com)回复于 2006-12-23 15:13:47 得分 0

我也接。。呵呵。。LZ真是好人啊Top

150 楼denggaojian()回复于 2006-12-23 17:07:09 得分 0

不错,刚学不是很久,努力中!  
  接分  
  Top

151 楼hnxxwyq(独自流浪)回复于 2006-12-23 18:35:42 得分 0

学习中。。。顺便接分!!Top

152 楼liaohaiying(超菜)回复于 2006-12-23 18:51:40 得分 0

楼主好人啊,希望大家以后多开这种贴,省的我到别的网站上扣下来,狗日的有些难扣的一比鸟屎Top

153 楼CDog108(陈)回复于 2006-12-28 23:19:08 得分 0

学习,学习.Top

154 楼lizhizhe2000(武安侯)回复于 2006-12-29 17:24:07 得分 0

接分1Top

155 楼swswssw(不停地学习...)回复于 2006-12-29 19:21:13 得分 0

星星和钻石真亮眼Top

156 楼kls131()回复于 2006-12-29 19:41:02 得分 0

学习接分中......谢谢Top

157 楼bjxjzh()回复于 2006-12-29 22:09:07 得分 0

有的是flash的,那样的东东怎么搞的啊?Top

158 楼ybawellsun()回复于 2006-12-30 08:23:17 得分 0

有思路就是强人,楼主就算一个Top

159 楼ne_rush()回复于 2007-04-25 13:19:05 得分 0

js   +   css  
  牛  
  Top

160 楼adverse(King)回复于 2007-04-27 21:16:09 得分 0

upTop

相关问题

关键词

得分解答快速导航

  • 帖主:Go_Rush

相关链接

  • Web开发类图书

广告也精彩

反馈

请通过下述方式给我们反馈
反馈
提问
网站简介|广告服务|VIP资费标准|银行汇款帐号|网站地图|帮助|联系方式|诚聘英才|English|问题报告
世纪乐知(北京)网络技术有限公司 版权所有, 京 ICP 证 020026 号
北京创新乐知广告有限公司 提供技术支持
Copyright © 2000-2007, CSDN.NET, All Rights Reserved
GongshangLogo