请问这个是什么效果

http://www.gaojie.com/apparel/hiavbehd
产品图片hover 切换这个效果叫什么名字呢我对js不大懂 只能利用现有的开源js改写麻烦 哪位大侠提供下js下载网址 十分感谢最好有mootools的

解决方案 »

  1.   

    这个没名字，因为就一个步骤就可以实现了，平时显示x.jpg，当onmouseover时候显示x_2.jpg
      

  2.   

    自己看源代码就知道了，两张相同尺寸的图片，默认显示其中一张，鼠标移上去时隐藏其中一张（display:none）。
      

  3.   


    能给个例子么 js菜鸟  最好js的
      

  4.   


    能给个例子么 js菜鸟  最好js的
      

  5.   

    <script type="text/javascript">
    function init(){
    var img=document.images[0];
    img.onmouseover=change;
    img.onmouseout=change;
    }
    function change(e){
    var a=e||window.event;
    if(a.type=="mouseover"){
    this.setAttribute("src","2.jpg");
    }else if(a.type=="mouseout"){
    this.setAttribute("src","1.jpg");
    }
    }
    window.onload=init;
    </script>
    </head><body>
    <img src="1.jpg" />
    </body>
    类似于这样试试
      

  6.   


    <img name="img" src="http://image.uctrac.com/20120627/17/2c8d29c2-b144-4901-b747-757de4fdb368.jpg"><script>
    window.onload = function () {
        var imgList = document.getElementsByName("img");
        var imgCount = imgList.length;
        for (var i = 0; i < imgCount; i++) {
            imgList[i].onmouseover = function() {
                this.src = "http://image.uctrac.com/20120627/16/16618e98-fc4d-4b54-babd-b1935d8c45ae.jpg";
            }
            imgList[i].onmouseout = function() {
                this.src = "http://image.uctrac.com/20120627/17/2c8d29c2-b144-4901-b747-757de4fdb368.jpg";
            }
        }
    }
    /**
    当然了，实际中你的图片名称应该是有规律的，如默认图片是a_1.jpg，当鼠标移上去的时候图片变成a_2.jpg，这个就可以轻松实现了
    */
    </script>
      

  7.   

    哪要那么复杂, 用CSS就能搞定了啊
    使用CSS Sprite, 图片在服务器端生成的时候, 就将两张图片组合到了一起, 分上下两个部分
    正常的就显示上半部分
    鼠标放上去就显示下半部分
    JS都不需要, 直接用CSS的Background-Image的Position来控制就可以了
      

  8.   

    如果硬是要用两张图片也可以, 
    <a>
    <img class="图片1"/>
    <img class="图片2"/>
    </a>---------------- CSS ----------------
    a .图片1 {display: none;}
    a .图片2 {display: block;}
    a:hover .图片1 {display: block;}
    a:hover .图片2 {display: none;}照样不需要JS, 用CSS就搞定
      

  9.   


    html代码如下 这只是一部分 因为产品很多 会一直重复的<div class="goodpic" style="height:160px; ">
    <a style=" width:120px;height:160px;" href="http://127.0.0.14/?product-46.html" target="_blank">
    <img class="fanhe" alt="#" src="#">
    <img class="fanhe1" alt="#" src="#">
    </a>
    </div>
    如何用js显示隐藏来实现这个功能 求教 
      

  10.   

    用firefox和firedebug看看源代码就知道了
      

  11.   

    推荐你使用 jQuery 框架，不但 开发文档详细齐全，而且插件遍地都是