我用vs.net 2008.怎么样能实现都可以。
 问题开始
1,在页面上一个方框里(单元格或空格都可以),显示几副图片(按3幅图吧),这几副图片定时变换。
2,变换到一个图片是,双击是一个连接(呵呵 这个简单,是为了问题连贯性)
3,在显示的图片上有这个有几个这图片的选择按钮(如1,2,3)图片动时按钮是不动的。当按钮得到焦点时,显示对应的图片。效果如http://www.healthbanks.cn/ 中间的定时变换的图片
先给120分解决后再加100分。这个东西 不错。 

解决方案 »

  1.   

    参考这个网站的代码。 用到了2个js文件。 yui.js和tbar.js
    你下载下来就行了。
    html代码部分就是下面的了。
    如果觉得这两个js文件太大。 可以百度或谷歌搜索 JS幻灯片。
    http://www.xz138.com/            <!-- 滚动图片 -->
                <div class="grayBorder2 fr">
                    <script src="/template/images/yui.js" type="text/javascript"></script><script src="/template/images/tbar.js" type="text/javascript"></script>
                    <div id="MainPromotionBanner">
                        <div id="SlidePlayer">
                            <ul class="Slides">
                                <li><a href="http://bible.younet.com/files/2008/07/03/394196.shtml" target="_blank"><img src="/template/images/s001.jpg"></a></li>
                                <li><a href="http://magzine.younet.com/html/22/05/08/536778_438121.shtml" target="_blank"><img src="/template/images/s002.jpg"> </a></li>
                                <li><a href="http://magzine.younet.com/html/22/05/08/536777_438120.shtml" target="_blank"><img src="/template/images/s003.jpg"></a></li>
                            </ul>
                            <div class="hackbox"></div>
                        </div>
                        <div class="hackbox"></div>
                    </div>
                    <div class="hackbox"></div>
                    <script type="text/javascript">TB.widget.SimpleSlide.decorate('SlidePlayer', {eventType:'mouse', effect:'scroll'});</script>
                </div>
      

  2.   

    http://blog.csdn.net/suyiming/archive/2008/05/08/2415756.aspx
      

  3.   

    一楼的兄弟,把代码都加上了。图片怎么没有定时变换啊 呵呵
    <script src="../yui.js" type="text/javascript"></script>
    <script src="../tbar.js" type="text/javascript"></script>
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head runat="server">
        <title>无标题页</title>
    </head>
    <body>
        <form id="form1" runat="server">
       <div class="grayBorder2 fr">
                    <script src="/template/images/yui.js" type="text/javascript"></script><script src="/template/images/tbar.js" type="text/javascript"></script>
                    <div id="MainPromotionBanner">
                        <div id="SlidePlayer">
                            <ul class="Slides">
                                <li><a href="http://bible.younet.com/files/2008/07/03/394196.shtml" target="_blank"><img src="/template/images/s001.jpg"></a></li>
                                <li><a href="http://magzine.younet.com/html/22/05/08/536778_438121.shtml" target="_blank"><img src="/template/images/s002.jpg"> </a></li>
                                <li><a href="http://magzine.younet.com/html/22/05/08/536777_438120.shtml" target="_blank"><img src="/template/images/s003.jpg"></a></li>
                            </ul>
                            <div class="hackbox"></div>
                        </div>
                        <div class="hackbox"></div>
                    </div>
                    <div class="hackbox"></div>
                    <script type="text/javascript">TB.widget.SimpleSlide.decorate('SlidePlayer', {eventType:'mouse', effect:'scroll'});</script>
                </div>    </form>
    </body>
    </html>
      

  4.   

    老兄,你说的那个效果如http://www.healthbanks.cn/ 中间的定时变换的图片 ,人家是做了一个flash实现的.
      

  5.   

    没有变化是我忘了贴Css的缘故。2楼用的是Flash幻灯片结合js。
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head runat="server">
    <title>无标题页</title>
    <style type="text/css">
    <!--
    /*scroll image*/
    #MainPromotionBanner{float:left; width:280px; height:160px; background:#FFF; }
        #MainPromotionBanner #SlidePlayer {position:relative; margin: 0 auto; }
            #MainPromotionBanner #SlidePlayer a { padding:0; }
            #MainPromotionBanner #SlidePlayer .hackbox { clear:both;  border-top:transparent 0px solid; }
            #MainPromotionBanner #SlidePlayer .Slides { padding: 0; margin: 0; list-style: none; height: 160px; overflow: hidden; }
            #MainPromotionBanner #SlidePlayer .Slides li { float: left; width: 280px; height: 160px; }
            #MainPromotionBanner #SlidePlayer .Slides img { border:0; display: block; width: 280px; height: 160px;  }
            #MainPromotionBanner #SlidePlayer .SlideTriggers { margin: 0; padding: 0; list-style: none;  position: absolute;  top: 135px;  right: 3px; z-index: 10; height: 25px;  }
            #MainPromotionBanner #SlidePlayer .SlideTriggers li { float: left; display: inline; color: #2E98D5; text-align: center; line-height:16px; width: 16px; height: 16px; font-family: Arial; font-size: .9em; cursor: pointer; overflow: hidden;  margin:3px 1px; border:1px solid #2E98D5; background-color:#fff; }
            #MainPromotionBanner #SlidePlayer .SlideTriggers li.Current { color:#fff;  background-color:#2E98D5; border:0;  font-weight:bold; font-size: 1.4em; line-height: 21px; height: 21px; width: 21px; margin:0 1px;  }
    -->
        </style>
    </head>
    <body>
    <form id="form1" runat="server">
      <div class="grayBorder2 fr">
        <script src="http://www.xz138.com/template/images/yui.js" type="text/javascript"> </script>
        <script src="http://www.xz138.com/template/images/tbar.js" type="text/javascript"> </script>
        <div id="MainPromotionBanner">
          <div id="SlidePlayer">
            <ul class="Slides">
              <li> <a href="http://bible.younet.com/files/2008/07/03/394196.shtml" target="_blank"> <img src="http://www.xz138.com/template/images/s001.jpg"> </a> </li>
              <li> <a href="http://magzine.younet.com/html/22/05/08/536778_438121.shtml" target="_blank"> <img src="http://www.xz138.com/template/images/s002.jpg"> </a> </li>
              <li> <a href="http://magzine.younet.com/html/22/05/08/536777_438120.shtml" target="_blank"> <img src="http://www.xz138.com/template/images/s003.jpg"> </a> </li>
            </ul>
            <div class="hackbox"> </div>
          </div>
          <div class="hackbox"> </div>
        </div>
        <div class="hackbox"> </div>
        <script type="text/javascript">TB.widget.SimpleSlide.decorate('SlidePlayer', {eventType:'mouse', effect:'scroll'}); </script>
      </div>
    </form>
    </body>
    </html>
      

  6.   

    jQuery仿迅雷图片轮换效果
      

  7.   

    js的问题
    推荐很强大的jquery ui:http://ui.jquery.com/个人感觉,比某些网站的flash+js的表现效果帅
      

  8.   

    20 楼的话有,现在好多程序员,都是CS 转过来的,对js 不是很熟悉。我原来是写VB 接口的 呵呵
      

  9.   

    LZ 看下懒人图库吧,有好多这样的效果,up ,
      

  10.   

    你把他的html代码弄过来看一下就明白。其实就是用脚本定时显示图片,其他隐藏。鼠标上去,就暂停。点按钮的时候,优待级高于定时器。