JavaScript簡單實現(xiàn)鼠標移動切換圖片的方法

更新時間：2016年02月23日 11:51:33 作者：Microblue

這篇文章主要介紹了JavaScript簡單實現(xiàn)鼠標移動切換圖片的方法,涉及JavaScript針對鼠標事件的響應(yīng)及頁面元素的動態(tài)變換技巧,需要的朋友可以參考下

本文實例講述了JavaScript簡單實現(xiàn)鼠標移動切換圖片的方法。分享給大家供大家參考，具體如下：

<title>JavaScript切換圖片</title>
<script>
function showDaTu(src){
document.getElementById("defaultImg").src=src;
}
</script>
<img src="images/wall1.jpg" id="defaultImg">
<br><br><br>
<img src='images/wall_s1.jpg' onmouseover="showDaTu('images/wall1.jpg')">
<img src='images/wall_s2.jpg' onmouseover="showDaTu('images/wall2.jpg')">
<img src='images/wall_s3.jpg' onmouseover="showDaTu('images/wall3.jpg')">
<img src='images/wall_s4.jpg' onmouseover="showDaTu('images/wall4.jpg')">
<br>因圖片較大，請等待圖片加載完成……然后鼠標放小圖上就會切換了。

更多關(guān)于JavaScript相關(guān)內(nèi)容感興趣的讀者可查看本站專題：《JavaScript查找算法技巧總結(jié)》、《JavaScript動畫特效與技巧匯總》、《JavaScript錯誤與調(diào)試技巧總結(jié)》、《JavaScript數(shù)據(jù)結(jié)構(gòu)與算法技巧總結(jié)》、《JavaScript遍歷算法與技巧總結(jié)》及《JavaScript數(shù)學運算用法總結(jié)》

希望本文所述對大家JavaScript程序設(shè)計有所幫助。

您可能感興趣的文章:

相關(guān)文章

javascript簡易緩動插件(源碼打包)
最近，同事在做一個項目的時候，有個需求，需要一款動畫庫來支持
2012-02-02
JavaScript在網(wǎng)頁中畫圓的函數(shù)arc使用方法
這篇文章主要介紹了JavaScript在網(wǎng)頁中畫圓的函數(shù)arc使用方法的相關(guān)資料,需要的朋友可以參考下
2015-11-11
談一談javascript閉包
這篇文章主要介紹了javascript閉包，閉包（closure）是Javascript語言的一個難點，也是它的特色，很多高級應(yīng)用都要依靠閉包實現(xiàn)，感興趣的小伙伴們可以參考一下
2016-01-01
uniapp導航欄組件使用步驟
在uni-app中，可以使用官方提供的uni-navigator組件來實現(xiàn)導航欄的功能，這篇文章主要介紹了uniapp導航欄組件如何使用,需要的朋友可以參考下
2024-01-01
小程序?qū)崿F(xiàn)上傳視頻功能
這篇文章主要為大家詳細介紹了小程序?qū)崿F(xiàn)上傳視頻功能，文中示例代碼介紹的非常詳細，具有一定的參考價值，感興趣的小伙伴們可以參考一下
2020-08-08
js中?new?Date().getTime()得到的是毫秒數(shù)時間戳
今天在寫一個函數(shù)的時候需要用的一個時間戳方便調(diào)用不同的隨機數(shù)?那么時間戳就是比較好的方式，主要怕瀏覽器緩存數(shù)據(jù)，下面就為大家簡單介紹一下
2023-07-07
JavaScript Array對象擴展indexOf()方法
JavaScript中Array對象沒有indexOf()方法，可通過下面的代碼擴展,需要的朋友可以參考下
2014-05-05
基于JavaScript實現(xiàn)Json數(shù)據(jù)根據(jù)某個字段進行排序
這篇文章主要介紹了基于JavaScript實現(xiàn)Json數(shù)據(jù)根據(jù)某個字段進行排序的相關(guān)資料,需要的朋友可以參考下
2015-11-11
常見JS驗證腳本匯總
這篇文章主要介紹了常見JS驗證腳本,結(jié)合實例形式匯總分析了JavaScript用于驗證的系統(tǒng)自帶函數(shù)與自定義函數(shù),具有一定參考借鑒價值,需要的朋友可以參考下
2015-12-12
談?wù)凧S中常遇到的瀏覽器兼容問題和解決方法
這篇文章主要介紹了談?wù)凧S中常遇到的瀏覽器兼容問題和解決方法，有些代碼在某些瀏覽器的某些版本中表現(xiàn)出不兼容，影響頁面的體驗；這時就需要處理了這些兼容問題，讓頁面在多個版本的瀏覽器上運行良好。
2016-12-12