色婷婷狠狠18禁久久YY,CHINESE性内射高清国产,国产女人18毛片水真多1,国产AV在线观看

jquery 鼠標懸浮換圖片

錢琪琛2年前8瀏覽0評論

JQuery是一個輕量級的JavaScript庫,可以用來簡化HTML文檔操作、事件處理、動畫效果、AJAX等多種操作。鼠標懸浮換圖片是jQuery中常見的一個功能,它可以讓圖片隨著鼠標的懸停發生變化。下面我們來看一下這個功能的實現。

// HTML部分
<div class="img-box">
<img src="pic1.jpg" alt="圖片1">
<img src="pic2.jpg" alt="圖片2">
</div>
// jQuery部分
$(".img-box img").hover(function() {
$(this).attr("src", $(this).attr("src").replace("1", "2"));
}, function() {
$(this).attr("src", $(this).attr("src").replace("2", "1"));
});

上面代碼中,我們首先在HTML部分定義了一個包含兩張圖片的div,分別為pic1.jpg和pic2.jpg。然后在jQuery部分,我們使用了hover()方法,其接受兩個參數,分別為鼠標進入和離開時觸發的函數。在進入時,我們使用attr()方法將圖片的src屬性進行替換,將其中的數字1替換為2,實現圖片的變化;在離開時,同樣進行反向操作,將數字2替換為1。

這種鼠標懸浮換圖片的效果可以用于網站的圖片展示、商品展示、導航欄等多個場景,可以提高用戶體驗,增加頁面的交互性。