我试图让图像在鼠标移出时消失。我让图像出现在鼠标悬停上，但我希望它在鼠标移开时隐藏。我的当前代码在下面有什么帮助吗？
var fullpic = new Array(4);
for (var i=0;i<fullpic.length;i++)
fullpic[i] = new Image(515,385);
fullpic[0].src = "images/FrenchQuarter.jpg";
fullpic[1].src = "images/GoldenGateBridge.jpg";
fullpic[2].src = "images/NazarethBay.jpg";
fullpic[3].src = "images/TheAlamo.jpg";
function displayFull(i){
document.getElementById("img-cover").src=fullpic[i].src;
}
/*This is the function i have to make the image hidden */
function hideFull(i){
document.getElementById("img-cover").css.visibility=hidden;
}
var fullbanner = new Array(4);
for (var i=0;i<fullbanner.length;i++)
fullbanner[i] = new Image(468,60);
fullbanner[0].src = "images/banner1.gif";
fullbanner[1].src = "images/banner2.gif";
fullbanner[2].src = "images/banner3.gif";
fullbanner[3].src = "images/banner4.gif";
var n = 0;
window.addEventListener("load",showFull,false);
function showFull(){
setInterval("showPic()",3000);
}
function showPic(){
document.getElementById("banner").src=fullbanner[n].src;
n++;
if(n>3)
n=0;
}<!DOCTYPE html>
<html>
<head>
<meta charset = "utf-8">
<title></title>
<link rel = "stylesheet" type = "text/css" href = "style.css">
<script src = "function.js"></script>
</head>
<body>
<div id = "banner-wrapper">
<img id = "banner" src = "images/banner1.gif">
</div>
<div id = "thumbs">
<img class = "thumb-img" src = "images/FrenchQuarter_small.jpg" onmouseover="displayFull(0)" onmouseout= "hideFull(0)">
<img class = "thumb-img" src = "images/GoldenGateBridge_small.jpg" onmouseover="displayFull(1)" onmouseout= "hideFull(1)">
<img class = "thumb-img" src = "images/NazarethBay_small.jpg" onmouseover="displayFull(2)" onmouseout= "hideFull(2)">
<img class = "thumb-img" src = "images/TheAlamo_small.jpg" onmouseover="displayFull(3)" onmouseout= "hideFull(3)">
</div>
<div id = "main-img">
<img id = "img-cover" src = "">
</div>
</body>
</html>最佳答案
检查错误控制台。你会看到:
ERROR: {
"message": "ReferenceError: hidden is not defined",
"filename": "http://stacksnippets.net/js",
"lineno": 61,
"colno": 5
}
隐藏未定义
因为它应该是一个字符串。放上引号..
function hideFull(i){
document.getElementById("img-cover").style.visibility='hidden';
}
关于javascript - 如何让图像在鼠标悬停时出现并在鼠标移出时隐藏，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/40534154/