我想在Wordpress页面中运行以下 javascript。因此,我将脚本直接复制到页面的源代码中。图像全部显示,但“鼠标悬停”效果不起作用..
我测试了嵌入在普通 html 页面中的脚本(直接作为代码),它运行良好。
非常感谢您的帮助和想法!
<script type="text/javascript">
var imgArray = new Array(
'pic1.jpg',
'pic2.jpg',
'pic3.jpg',
'pic4.jpg',
'pic5.jpg'
);
function swapImage(imgID) {
var theImage = document.getElementById('theImage');
var newImg;
newImg = imgArray[imgID];
theImage.src = newImg;
}
function preloadImages() {
for(var i = 0; i < imgArray.length; i++) {
var tmpImg = new Image;
tmpImg.src = imgArray[i];
}
}
</script>
<div id="image">
<img id="theImage" src="images/pic1.jpg" alt="" />
</div>
<div id="thumbs">
<img src="images/pic1_tn.jpg" alt="" onmouseover="swapImage(0);" />
<img src="images/pic2_tn.jpg" alt="" onmouseover="swapImage(1);" />
<img src="images/pic3_tn.jpg" alt="" onmouseover="swapImage(2);" />
<img src="images/pic4_tn.jpg" alt="" onmouseover="swapImage(3);" />
<img src="images/pic5_tn.jpg" alt="" onmouseover="swapImage(4);" />
<br />
</div>