0

こんにちは、単純なロールオーバー onmouseover 効果があります。いくつかのスクリプトを試しましたが、どれも機能しません。誰か教えていただけますか?`

JavaScript:

<script language="JavaScript" type="text/javascript">
<!--
if (document.images) {
    homebuttonup = new Image();
    homebuttonup.src = "./images/gym-light.png";
    homebuttondown = new Image();
    homebuttondown.src = "./images/buttonright.png";
}

function buttondown(buttonname) {
    if (document.images) {
        document[buttonname].src = eval(buttonname + "down.src");
    }
}

function buttonup(buttonname) {
    if (document.images) {
        document[buttonname].src = eval(buttonname + "up.src");
    }
}
// -->
</script>

とリンク：

    <a href="index.html" onmouseover="buttondown('homebutton')"       onmouseout="buttonup('homebutton')">
  <img id='Img4Inner' name="homebutton" src='./images/gym-light.png' alt="" />

  </a>
4

2 に答える 2

1

**更新 2 (最後の笑) ** 現在、a タグに onmouseout と onmouseover があり、それらを image タグに移動すると機能します。

あなたはコードです：

<a onmouseout="buttonup('homebutton')" onmouseover="buttondown('homebutton')"        
href="http://www.[...].com" style="height:120px;width:100px;">
<img id="Img4Inner" alt="" src="http://[..].com/images/gym-light.png" name="homebutton">
</a>

作業コード:

<a onmouseout="buttonup('homebutton')" onmouseover="buttondown('homebutton')"        
href="http://www.[...].com" style="height:120px;width:100px;">
 <img alt="" src="http://[...]/images/gym-light.png"  onmouseout="buttonup(this)" 
     onmouseover="buttondown(this)" name="homebutton" id="Img4Inner">
</a>

更新: アンカー タグで関数を呼び出しているため、次のような高さと幅が必要です (それに応じて高さと幅を配置します)。

<a style="height:25px;width:25px;" href="http://www.[...].com" 
onmouseover="buttondown('homebutton')" onmouseout="buttonup('homebutton')">
...
</a>

そして私は外出中...

私はfirebugを使用し、HTMLを高さと幅で編集しましたが、うまくいきました：

ここに画像の説明を入力)

そして、私はそれが問題を解決すると確信していますが.. doctype は <!doctype html> に設定されており、ここにあるもののようなものでなければなりません ( LINK )

以下のアプローチを実装した場合、画像には高さと幅があり、それがターゲティングされている画像であるため、より理にかなっている可能性があります..

http://jsfiddle.net/ETHaM/2/ 

if (document.images) {
    homebuttonup = new Image();
    homebuttonup.src = "http://www.placekitten.com/100/100/";
    homebuttondown = new Image();
    homebuttondown.src = "http://dummyimage.com/100x100/000/fff";
}

function buttondown(obj) {
    if (document.images) {
        obj.src = eval(obj.name+ "down.src");
    }
}

function buttonup(obj) {
    if (document.images) {
        obj.src = eval(obj.name + "up.src");
    }
}


<a href="index.html">
<img id='Img4Inner' onmouseover="buttondown(this)" onmouseout="buttonup(this)" name="homebutton" src='http://www.placekitten.com/100/100/' alt="" />
</a>
于 2012-04-18T18:51:33.807 に答える
0

あなたのコードは動作します

ただし、これはより目立たないバージョンです

http://jsfiddle.net/mplungjan/927nN/

<a href="index.html" id="homeLink"><img
 id='Img4Inner' class="hoverImg"
 name="homebutton" src='http://www.placekitten.com/100/100/' alt="" /></a>
 <a href="about.html" id="aboutLink"><img
 id='Img5Inner' class="hoverImg"
 name="aboutbutton" src='http://www.placekitten.com/100/100/' alt="" /></a>

var buttons={};
if (document.images) {
    buttons["homebuttonup"] = new Image();
    buttons["homebuttonup"].src = "http://www.placekitten.com/100/100/";
    buttons["homebuttondown"] = new Image();
    buttons["homebuttondown"].src = "http://dummyimage.com/100x100/000/fff";
    buttons["aboutbuttonup"] = new Image();
    buttons["aboutbuttonup"].src = "http://www.placekitten.com/100/100/";
    buttons["aboutbuttondown"] = new Image();
    buttons["aboutbuttondown"].src = "http://dummyimage.com/100x100/000/fff";
}

window.onload=function() {
    var images = document.getElementsByTagName("img");
    for (var i=0,n=images.length;i<n;i++) {
        if (images[i].className=="hoverImg") {
            images[i].parentNode.onmouseover=function() {
              var buttonname=this.id.replace("Link","button");
              document[buttonname].src = buttons[buttonname + "down"].src;
            }
            images[i].parentNode.onmouseout=function() {
              var buttonname=this.id.replace("Link","button");
              document[buttonname].src = buttons[buttonname + "up"].src;
            }
        }
    }   
}
于 2012-04-18T19:15:53.050 に答える