JavaScript簡(jiǎn)單實(shí)現(xiàn)鼠標(biāo)移動(dòng)切換圖片的方法
更新時(shí)間：2016年02月23日 11:51:33 作者：Microblue
這篇文章主要介紹了JavaScript簡(jiǎn)單實(shí)現(xiàn)鼠標(biāo)移動(dòng)切換圖片的方法,涉及JavaScript針對(duì)鼠標(biāo)事件的響應(yīng)及頁面元素的動(dòng)態(tài)變換技巧,需要的朋友可以參考下
本文實(shí)例講述了JavaScript簡(jiǎn)單實(shí)現(xiàn)鼠標(biāo)移動(dòng)切換圖片的方法。分享給大家供大家參考，具體如下：
<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>因圖片較大，請(qǐng)等待圖片加載完成……然后鼠標(biāo)放小圖上就會(huì)切換了。
更多關(guān)于JavaScript相關(guān)內(nèi)容感興趣的讀者可查看本站專題：《JavaScript查找算法技巧總結(jié)》、《JavaScript動(dòng)畫特效與技巧匯總》、《JavaScript錯(cuò)誤與調(diào)試技巧總結(jié)》、《JavaScript數(shù)據(jù)結(jié)構(gòu)與算法技巧總結(jié)》、《JavaScript遍歷算法與技巧總結(jié)》及《JavaScript數(shù)學(xué)運(yùn)算用法總結(jié)》
希望本文所述對(duì)大家JavaScript程序設(shè)計(jì)有所幫助。
您可能感興趣的文章:
- js鼠標(biāo)點(diǎn)擊按鈕切換圖片-圖片自動(dòng)切換-點(diǎn)擊左右按鈕切換特效代碼
- JS鼠標(biāo)滑過圖片時(shí)切換圖片實(shí)現(xiàn)思路
- js動(dòng)態(tài)切換圖片的方法
- JavaScript實(shí)現(xiàn)自動(dòng)切換圖片代碼
- 使用JavaScript實(shí)現(xiàn)點(diǎn)擊循環(huán)切換圖片效果
- 原生JS實(shí)現(xiàn)隱藏顯示圖片 JS實(shí)現(xiàn)點(diǎn)擊切換圖片效果
- js實(shí)現(xiàn)使用鼠標(biāo)拖拽切換圖片的方法
- 圖片旋轉(zhuǎn)、鼠標(biāo)滾輪縮放、鏡像、切換圖片js代碼
- javascript實(shí)現(xiàn)點(diǎn)擊按鈕切換圖片
- JS實(shí)現(xiàn)點(diǎn)擊button按鈕切換圖片
相關(guān)文章
這篇文章主要介紹了ES6 對(duì)象的新功能與解構(gòu)賦值介紹，小編覺得挺不錯(cuò)的，現(xiàn)在分享給大家，也給大家做個(gè)參考。一起跟隨小編過來看看吧2019-02-02
不同的排序算法，執(zhí)行效率有著天壤之別，本腳本用JavaScript演示了各種常見的排序算法，包括：冒泡排序、選擇排序、插入排序、謝爾排序、快速排序(遞歸)、快速排序(堆棧)、歸并排序、堆排序2014-09-09
JS實(shí)現(xiàn)網(wǎng)頁上隨機(jī)產(chǎn)生超鏈接地址的方法
這篇文章主要介紹了JS實(shí)現(xiàn)網(wǎng)頁上隨機(jī)產(chǎn)生超鏈接地址的方法,涉及JavaScript隨機(jī)數(shù)的相關(guān)使用技巧,具有一定參考借鑒價(jià)值,需要的朋友可以參考下2015-11-11
JavaScript中的this陷阱的最全收集并整理(沒有之一)
這篇文章主要介紹了JavaScript中的this陷阱的最全收集,需要的朋友可以參考下2017-02-02
javascript 彈出層效果代碼。需要的朋友可以測(cè)試下。2009-10-10
JavaScript setInterval()與setTimeout()計(jì)時(shí)器
這篇文章主要介紹了JavaScript setInterval()與setTimeout()計(jì)時(shí)器，文中通過示例代碼介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2019-12-12
ant-design-pro使用qiankun微服務(wù)配置動(dòng)態(tài)主題色的問題
這篇文章主要介紹了ant-design-pro使用qiankun微服務(wù)配置動(dòng)態(tài)主題色,本文給大家介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或工作具有一定的參考借鑒價(jià)值，需要的朋友可以參考下2022-03-03
JS實(shí)現(xiàn)在線Excel的附件上傳與下載
在本地使用Excel時(shí)，經(jīng)常會(huì)有需要在Excel中添加一些附件文件的需求，今天小編將為大家介紹如何使用前端HTML+JS+CSS技術(shù)通過超鏈接單元格的形式實(shí)現(xiàn)在線Excel附件上傳、下載和修改的操作，需要的可以參考下2023-08-08
這篇文章主要為大家詳細(xì)介紹了js實(shí)現(xiàn)隨機(jī)點(diǎn)名，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下
2021-01-01