[英]Make a different image appear when hovering over a div
我已經嘗試了許多方法來解決此問題，但似乎找不到解決方案，因此該是時候向更有經驗的人尋求幫助了。 基本上，我想要的是將圖像懸停在img所在的圖像的“ div”（框）上時進行更改。請看一下代碼：
<!DOCTYPE html>
<html>
<head>
<style>
body {
background: grey;
}
#box {
margin: 0 auto;
width: 300px;
height: 300px;
background: blue
}
#box img {
display: block;
margin: 0 auto;
padding-top: 75px;
}
</style>
<meta charset="utf-8">
</head>
<body>
<a href="#">
<div id="box">
<img src="registration_icon_white.png" onmouseover="src='registration_icon_black.png'" onmouseout="'registration_icon_black.png'">
</div>
</a>
</body>
（圖像是相同的，只是顏色不同）
任何幫助，將不勝感激，謝謝。
您也沒有指定要分配URL的src。 您需要在onmouseover和onmouseout事件中使用this.src='URL' 。
這是有關this關鍵字的鏈接： “ this”關鍵字如何工作？
試試this.src ：
<div id="box">
<img title="some title" src="registration_icon_white.png"
onmouseover="this.src='registration_icon_black.png'"
onmouseout="this.src='registration_icon_white.png'">
</div>
您可以將圖像放在div的背景中。
<div id="box"></div>
#box {
background: url("registration_icon_black.png");
height: 500px;
}
#box:hover{
background: url("registration_icon_white.png");
}
將鼠標懸停在錨標簽內的圖像上且錨標簽位於div內時，如何使文本顯示？
[英]How to make text appear when hovering over an image that's inside an anchor tag and the anchor tag is inside a div?
將鼠標懸停在一個div容器中的圖像上，以使img或背景出現在另一個容器中或上方
[英]Hovering over an image in one div container to have an img or background appear in or over top of a different container
聲明:本站的技術帖子網頁，遵循CC BY-SA 4.0協議，如果您需要轉載，請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.