JQUERY - 恢復類鼠標了

您可以檢查這個網站，我創造：JQUERY - 恢復類鼠標了

http://www.tinybigstudio.com/proyectos/golfycia/

如果你將鼠標懸停在「PRECIO」它改變了球的形象，但對老鼠出來的時候，我想足球的形象要恢復，我不能這樣做。

這是JavaScript：提前

<script> 
$(document).ready(function() { 
    $("#secciones span").hover(function() { 
     $("#golfball img").removeClass("opaque"); 

     var imageToShow = $(this).attr("id").replace("for-", ""); 
     $("#golfball #" + imageToShow).addClass("opaque"); 

    }); 
}); 

$(document).ready(function() { 
    $("#secciones span").mouseout(function() { 
     $("#image-1").addClass("opaque"); 

    }); 
}); 

</script>

謝謝！

來源

2011-11-02 pablo dominguez

這個工程：

$(document).ready(function() { 
     $("#secciones span").hover(function() { 
      $("#golfball img").removeClass("opaque"); 

      var imageToShow = $(this).attr("id").replace("for-", ""); 
      $("#golfball #" + imageToShow).addClass("opaque"); 

     }, function() { 
      $("#golfball #image-1").addClass("opaque"); 
      $("#golfball #image-2").removeClass("opaque"); 
     }); 
    });

重要 - 刪除此：

<script> 
$(document).ready(function() { 
    $("#secciones span").mouseout(function() { 
     $("#image-1").removeClass("opaque"); 

    }); 
}); 

</script>

來源

2011-11-02 19:56:05

hover方法可以接受第二個參數，該參數是一個在mouseout上調用的函數。

來源

2011-11-02 19:42:25 Phil

聯合一切：

$(document).ready(function() { 
    $("#secciones span").hover(function() { 
     $("#golfball img").removeClass("opaque"); 

     var imageToShow = $(this).attr("id").replace("for-", ""); 
     $("#golfball #" + imageToShow).addClass("opaque"); 

    },function() { 
     $("#image-1").removeClass("opaque"); 
    }); 
});

來源

2011-11-02 19:43:11 Neal

謝謝，但它仍然沒有工作 –

@ user792558多數民衆贊成多數民黨這是因爲我認爲你是從錯誤的對象中刪除類... – Neal

謝謝，代碼現在糾正。 –

一個簡單的方法是使用toggleClass()方法：

$("#secciones span").hover(function() { $(this).toggleClass("opaque"); });

這是短期和簡單。只需設置高爾夫球的默認背景圖像。並創建一個覆蓋背景的新類。當您將鼠標懸停在高爾夫球上時，使用上面的代碼來開啓和關閉新課程。

來源

2011-11-02 19:46:58

謝謝，但事情是，什麼是houd應該是< span >的 –

您mouseout從#image-1而不是#image-2

去除opaque類試試這個

$("#secciones span").hover(function() { // mouse over 
    $('#image-2').addClass('opaque'); 
}, function() { // mouse out 
    $('#image-2').removeClass('opaque'); 
});

來源

2011-11-02 19:48:08 MikeM

該代碼有一個小小的錯誤，它應該是'code' –

JQUERY - 恢復類鼠標了

回答

相關問題