1

JavaScript関数を記述して使用し、コンテンツをHTML要素に挿入することになっています。•次のステートメントを含むswapOutという名前の関数を作成します:document.imageFlip.src="最初の画像の名前"。•次のステートメントを含むswapBackという名前の関数を作成します:document.imageFlip.src="2番目の画像の名前"。•IDと名前がmyImageのdivタグを挿入します。
•divコンテナ内に、imageFlipというIDと名前の画像タグを挿入します。画像タグを初期化して、最初の画像を表示します。高さと幅の属性を設定します。alt属性とtitle属性を「Swappableimage」に設定します。alt="スワップ可能な画像"title="スワップ可能な画像"height= "" width = ""

•画像タグ内に、onmouseover = "swapOut()"およびonmouseout = "swapBack()"を追加します。これらは、画像要素が認識するイベントを定義します。1つ目は、画像の上にマウスを移動すると、swapOut関数を呼び出します。2つ目は、マウスを画像から離すと、swapBack関数を呼び出します。

これまで私はこれを行いました。私の.js形式で私は持っています

function swapOut() {
    document.imageFlip.src = "firstImage"
}

function swapBack() {
    document.imageFlip.src = "secondImage"
}

そして私の.htmフォームで私は持っています

<div id="myImage" name="myImage">


<img src="firstImage.png" alt="Swappable image" title="Swappable image" id="imageFlip" 
name="imageFlip" onmouseout="swapBack()" onmouseover="swapOut()" height="200" width="200"/>


</div>

画像を交換する必要がありますが、最初の画像が表示されますが、その上にカーソルを合わせると、画像のないボックスしか表示されません。

4

3 に答える 3

0
<img src="firstImage.png" alt="Swappable image" title="Swappable image" onMouseOver="this.src='secondImage.png'" onMouseOut="this.src='firstImage.png'" height="200" width="200"/>
于 2012-11-12T04:40:30.657 に答える
0

「src」属性への割り当てに、完全な画像パスと拡張子があることを確認してください。

あなたの場合、それは

document.imageFlip.src = "firstImage.png"
// or
document.imageFlip.src = "secondImage.png"

また、使用できます

document.getElementById('imageFlip').src = "firstImage.png"

どこでも name 属性を使用したくない場合は、これがこの種のことを行う一般的な方法です (これについては間違っている可能性があります) が、name 属性は HTML5 では非推奨になっていると思います。

于 2012-11-12T04:19:30.943 に答える
0

あなたのイメージの延長を見逃しています。

于 2012-11-12T04:25:45.590 に答える