诚心求解：关于页面跳转的问题

javascript 这种特效网上很多哈

解决方案 »

  1.   

    http://ajax.asp.net/ajaxtoolkit/Tabs/Tabs.aspx
    http://ajax.asp.net/
      

  2.   

    <span onMouseOver="window.location.href='news.asp'">新闻</span>
    <span onMouseOver="window.location.href='music.asp'">音乐</span>
      

  3.   

    理解错了,这是滑动门,给你个例子<HTML><HEAD><TITLE>绝对经典的滑轮新闻显示(javascript+css)</TITLE>
    <style type="text/css">
    <!--
    *{padding:0; margin:0}
    img{border:0; display:block;}
    BODY {
    PADDING-RIGHT: 0px; PADDING-LEFT: 0px; FONT-SIZE: 12px; PADDING-BOTTOM: 0px; MARGIN: 0px auto; COLOR: black; LINE-HEIGHT: 150%; PADDING-TOP: 10px; BACKGROUND-COLOR: white; TEXT-ALIGN: center
    }
    .dis {
    DISPLAY: block
    }
    .undis {
    DISPLAY: none
    }
    #cntR {
    WIDTH: 302px
    }
    #NewsTop {
    CLEAR: both; MARGIN-BOTTOM: 16px
    }
    #NewsTop P {
    FLOAT: left; LINE-HEIGHT: 21px
    }
    #NewsTop P.topTit {
    FONT-WEIGHT: bold; WIDTH: 117px
    }
    #NewsTop P.topC0 {
    BACKGROUND: #dcdcdc; BORDER-LEFT: #f2f2f2 1px solid; WIDTH: 40px; CURSOR: pointer
    }
    #NewsTop P.topC1 {
    BACKGROUND: #c2130e; BORDER-LEFT: #f2f2f2 1px solid; WIDTH: 40px; COLOR: #fff
    }
    #NewsTop #NewsTop_tit {
    BORDER-BOTTOM: #c2130e 3px solid; HEIGHT: 21px
    }
    #NewsTop #NewsTop_cnt {
    PADDING-LEFT: 32px; LINE-HEIGHT: 26px; PADDING-TOP: 7px; HEIGHT: 260px; TEXT-ALIGN: left
    }
    #NewsTop #NewsTop_cnt A {
    COLOR: #666; TEXT-DECORATION: none
    }
    #NewsTop #NewsTop_cnt A:hover {
    COLOR: #c2130e; TEXT-DECORATION: underline
    }
    -->
    </style>
    </HEAD>
    <BODY>
    <DIV id="cntR">
      <DIV id="NewsTop">
        <DIV id="NewsTop_tit">
          <P class="topTit">A</P>
          <P class="topC0">B</P>
          <P class="topC0">C</P>
          <P class="topC0">D</P>
          <P class="topC0">E</P>
        </DIV>
        <DIV id="NewsTop_cnt">
    <SPAN title="Don't delete me"></SPAN>
    <SPAN>b</SPAN>
    <SPAN>c</SPAN>
    <SPAN>d</SPAN>
    <SPAN>e</SPAN>
    </DIV>
                <SCRIPT>
    var Tags=document.getElementById('NewsTop_tit').getElementsByTagName('p'); 
    var TagsCnt=document.getElementById('NewsTop_cnt').getElementsByTagName('span'); 
    var len=Tags.length; 
    var flag=1;//修改默认值
    for(i=1;i<len;i++){
    Tags[i].value = i;
    Tags[i].onmouseover=function(){changeNav(this.value)}; 
    TagsCnt[i].className='undis';
    }
    Tags[flag].className='topC1';
    TagsCnt[flag].className='dis';
    function changeNav(v){
    Tags[flag].className='topC0';
    TagsCnt[flag].className='undis';
    flag=v;
    Tags[v].className='topC1';
    TagsCnt[v].className='dis';
    }
    </SCRIPT>
      </DIV>
    </DIV>
    </BODY></HTML>