我在这个问题上停留了很长时间..希望有人可以帮助我,因为我不精通 Javascript。
场景是这样的:
我正在使用 wordpress,在一个页面中,我有一张大图片(800 像素 X 1200 像素),里面有纸杯蛋糕。
我希望达到的效果是这样的;当用户将鼠标悬停在特定的纸杯蛋糕上(带有一层透明 div)时,会出现一个图像(320px x 320px)。
我尝试使用 css :hover,它适用于 safari、chrome 和 firefox。但对于 IE,它不起作用。因此,我正在考虑使用 javascript 来操作 div 类而不是onmouseover和onmouseout事件
PHP/HTML:
<div id="f1"></div>
CSS:
#f1{
width: 100px;
height: 50px;
left: 370px;
top: 450px;
position: absolute;
opacity:0;
}
因此,当用户将鼠标悬停在透明 div 上时,我希望出现一个图像(320px x 320px)。
非常感谢!