0

私はJavaScriptにかなり慣れていないのでmouseover、リンクすると、ページの右側の画像が変更され、次に変更されるようにしようとしていますmouseout.

ここに私のJavaScriptがあります:

function SwapOut(titleid){
if (titleid == video)
    document.getElementById("titleimg").src="images/videotitle.png"
else if (titleid == gamedesign)
   document.getElementById("titleimg").src="images/gametitle.png"       
else if (titleid == webdesign)
   document.getElementById("titleimg").src="images/webtitle.png"    
return true;
}

function SwapBack('titleid'){
if (titleid == home)
    document.getElementById("titleimg").src="images/hometitle.png"
else if (titleid == gamedesign)
   document.getElementById("titleimg").src="images/gametitle.png"   
else if (titleid == video)
   document.getElementById("titleimg").src="images/videotitle.png"  
else if (titleid == webdesign)
   document.getElementById("titleimg").src="images/webtitle.png" 
return true;
}

そして私のHTML：

<a id="eileenSmall1" href="video.html" onmouseover="SwapOut('video')" onmouseout="SwapBack('home')"></a>

<div id="title">
    <img src="images/hometitle.png" name="titleimg"/>
</div>

私は通常 CSS でこれにアプローチしますが、別の要素のプロパティを変更しているため、CSS を機能させるのに問題がありました。どんな助けでも大歓迎です！

4

3 に答える 3

0

id1） 「titleimg」で要素を参照しようとしていますが、要素にまったく与えていませんid。

2）あなたのif条件はtitleid、それが変数であると考えるものと比較する文字列と比較しません..たとえば、そうではあり'video'ませんvideo.

3) 2 番目の関数では、パラメーターは文字列ではなく変数である必要があります。たとえば、そうではありSwapBack(titleid)ませんSwapBack('titleid')。

あなたはこれを試してみるべきです...

ジャバスクリプト:

function SwapOut(titleid){
if (titleid == 'video')
    document.getElementById("titleimg").src="images/videotitle.png"
else if (titleid == 'gamedesign')
   document.getElementById("titleimg").src="images/gametitle.png"       
else if (titleid == 'webdesign')
   document.getElementById("titleimg").src="images/webtitle.png"    
return true;
}

function SwapBack(titleid){
if (titleid == 'home')
    document.getElementById("titleimg").src="images/hometitle.png"
else if (titleid == 'gamedesign')
   document.getElementById("titleimg").src="images/gametitle.png"   
else if (titleid == 'video')
   document.getElementById("titleimg").src="images/videotitle.png"  
else if (titleid == 'webdesign')
   document.getElementById("titleimg").src="images/webtitle.png" 
return true;
}

HTML:

<a id="eileenSmall1" href="video.html" onmouseover="SwapOut('video')" onmouseout="SwapBack('home')"></a>

<div id="title">
    <img src="images/hometitle.png" name="titleimg" id="titleimg" />
</div>
于 2012-11-12T19:40:04.990 に答える
0

まず、if (titleid == video)有効ではありません-ビデオを存在しない変数として参照しようとしています。if (titleid == 'video')テキストの文字列であることを示す必要があります。

第二に、そこに if ロジックは必要ありません。あなたがしている場所onmouseover="SwapOut('video')"では、代わりに画像を渡すことができます。

例えば、

function swapOut(img)
{
    document.getElementById('titleimg').src = img;
}

HTML

<a id="eileenSmall1" href="video.html" onmouseover="SwapOut('images/videotitle.png')"></a>

Swapback には条件付きロジックは必要ありません (常にイメージをホームに切り替えたいと仮定します)。

于 2012-11-12T19:47:08.510 に答える
0

ID で titleimg を参照していますが、ID を割り当てておらず、名前だけを割り当てています

 <img src="images/hometitle.png" name="titleimg" id="titleimg"/>

また、関数に渡すパラメーターは文字列変数です。関数は次のようになります

function SwapOut(titleid){
if (titleid == 'video')
    document.getElementById("titleimg").src="images/videotitle.png"
else if (titleid == 'gamedesign')
   document.getElementById("titleimg").src="images/gametitle.png"       
else if (titleid == 'webdesign')
   document.getElementById("titleimg").src="images/webtitle.png"    
return true;
}

function SwapBack(titleid){
if (titleid == 'home')
    document.getElementById("titleimg").src="images/hometitle.png"
else if (titleid == 'gamedesign')
   document.getElementById("titleimg").src="images/gametitle.png"   
else if (titleid == 'video')
   document.getElementById("titleimg").src="images/videotitle.png"  
else if (titleid == 'webdesign')
   document.getElementById("titleimg").src="images/webtitle.png" 
return true;
}

引用符に注意して、文字列を比較しています。たとえば

titleid == 'home' vs titleid == ホーム

関数 SwapBack('titleid') の引用符も失われます

于 2012-11-12T19:32:10.597 に答える