1

ここの初心者なので、plsは我慢してください:)

ページの左端に配置された画像（Image＃1）があり（すべての本文のパディングと余白が0に設定されています）、ロールオーバーJavaScriptを追加して、マウスオーバー時に新しい画像（Image＃2）がその場所に表示されるようにしました。 。画像＃2は画像＃1よりも大きいです。

現時点では、マウスオーバー時にImage＃2が表示されますが、ページに対して左端に配置されていません（デフォルトのページ余白が再導入され、本文のCSSルールが無視されているようです）。

とにかくIDをImage＃2に適用して、そのCSSスタイルを制御できるようにする方法はありますか？または、マウスオーバーに表示されるマージンを削除する他の方法はありますか？基本的には、2つの画像を左端で重ねて表示したいと思います。

感謝します。ありがとう！

4

4 に答える 4

1 
<head>
<script type="text/javascript" src="http://code.jquery.com/jquery-latest.min.js"></script>
</head>

$('img#id').mouseover(function(){
$(this).css("property","value");

});

jQueryが必要です..

/////////////////////////////////////////////// ///////////////////////////////////

var elem = document.getElementById("id"); //your img id is passed in here
elem.onmouseover= function(){
this.style.yourPropertiesInCamelCase = "value";
}

/////////////////////////////////////////////// /////////////////////////////////// PS:キャメルケースがわからない場合はグーグルで検索できますは... 「純粋な」Javascript の css プロパティには注意してください。ブラウザの不一致の可能性があります...コードがクロスブラウザでなくなる可能性があります...

于 2011-02-23T17:37:02.800 に答える
0

単純なことに JavaScript を使用する代わりに、CSS のアンカー ホバー状態を使用して背景画像を交換することをお勧めします。また、一度に読み込んでホバー時に背景位置を変更できるように、画像を 1 つの画像にする必要があります...

http://jsfiddle.net/k36am/

于 2011-02-23T20:29:02.680 に答える
0

考えたのか…

<script type="text/javascript">
function changeImage() {
   document.getElementById("theImg").src = "other.gif";
}
</script>

<img src="/myImage.gif" id="theImg" onmouseover="changeImage()" />
于 2011-02-23T17:37:40.630 に答える
0

固定寸法と 0-paddings を使用して、その中に画像を追加することができます。それはうまくいくかもしれませんか？わからない。

とにかく、ロールオーバーを行うには、初期画像の「src」属性を変更する必要があります。残りは同じままにする必要があります。

于 2011-02-23T17:39:23.153 に答える