0

これは私がこれまでに持っているものです.Javascriptのビデオをたくさん見てきました.

より、マウスオーバーでlogo1からlogo2に変わります。これは宿題です。ただし、宿題は私にとって重要なので、助けや指導をいただければ幸いです。

</head>

<body>
<p>
<div>
<script type="text/javascript">
// Pre load images for rollover
function imgOver(id) 
{
    document.getElementById(id).src="logo1.jpg";
}

function imgOut(id) 
{
    document.getElementById(id).src="logo2.jpg";
}

</script>   
<a href="#" onmouseover="imgOver('logo1');" onmouseout="imgOut('logo2')">
<img alt="logo" height="150" src="images/Logo1.jpeg" width="110" />
</a>
</div>
</body>

</html>

新しいコード、まだ....機能していません! =(

</head>

<body>
<div>
<p>
<script type="text/javascript">
// Pre load images for rollover
function imgOver() 
{
    document.getElementById('logo').src="images/logo1.jpg"; // ensure correct image path
}

function imgOut() 
{
    document.getElementById('logo').src="images/logo2.jpg"; // ensure correct image path
}
</script>   
<a href="#" onmouseover="imgOver('logo1');" onmouseout="imgOut('logo2')">
<img alt="logo" height="150" src="images/Logo1.jpeg" width="110" />
</a>
</p>
</div>
</body>

</html>
4

2 に答える 2

2

これを試して：

<script type="text/javascript">
// Pre load images for rollover
function imgSwap(imgSrc) 
{
    document.getElementById('logo').src = "images/"+imgSrc+".jpeg";
}

</script>   
<a href="#" onmouseover="imgSwap('Logo1');" onmouseout="imgSwap('Logo2')">
<img id="logo" alt="logo" height="150" src="images/Logo1.jpeg" width="110" />
</a>

id以前は、使用されなかったものを渡しています。images/また、srcはディレクトリを指す必要があります。

于 2012-11-04T05:03:22.910 に答える
1

ID変更されることはないため、画像要素を関数imgOverに渡す必要はありません。関数は次のように変更する必要があります。imgOutID

function imgOver() {
    document.getElementById('logo').src="logo1.jpg"; // ensure correct image path
}

function imgOut() {
    document.getElementById('logo').src="logo2.jpg"; // ensure correct image path
}

logo1.jpg次に、とへの正しいパスを指定していることを確認してくださいlogo2.jpg。例：元のHTMLを作成すると、それぞれimages /logo1.jpgとimages/ logo2.jpgを使用する必要があるように見えます。

画像要素にはIDが必要です。<img id="logo" alt="logo" height="150" src="images/Logo1.jpeg" width="110" />

完全な出典：

<script type="text/javascript">
function imgOver() {
    document.getElementById('logo').src="images/logo1.jpg"; // ensure correct image path
}
function imgOut() {
    document.getElementById('logo').src="images/logo2.jpg"; // ensure correct image path
}
</script>   
<a href="#" onmouseover="imgOver()" onmouseout="imgOut()">
    <!-- note the id="logo" part below -->
    <img id="logo" alt="logo" height="150" src="images/Logo1.jpeg" width="110" />
</a>
于 2012-11-04T05:02:52.273 に答える