1

マウスオーバーすると、次のようになります

<input type="image" src="1.jpg" />

onmouseout のときは、次のようになります。

<input type="image" src="2.jpg" />
4

5 に答える 5

1

を保持し、<input type=reset>Javascriptを使用して非表示にし、<a>要素を作成してスタイルを設定し、イベントハンドラーをアンカーにアタッチしclickてリセットをトリガーし、:hoverアンカーでCSSを使用して背景画像を変更します。Javascriptを使用していないユーザーには、通常のoleのリセットボタンが表示されます。

于 2009-10-22T03:31:19.860 に答える
0

あなたが何をしようとしているのか正確にはわかりませんが、Tordekのように、CSSと:hoverを使用することをお勧めします

CSSは次のとおりです。

.myButton{
  background:url("2.jpg") no-repeat;
  width: 200px;
  height: 100px;
  border: none;
}
.myButton:hover {
  background:url("1.jpg") no-repeat;
  width: 200px;
  height: 100px;
  border: none;
}

そしてここにHTMLがあります:

<input type="submit" class="myButton" value="">
于 2009-10-22T03:27:00.560 に答える
0

これは、エンドユーザーがの特定の場所を指すことができる<input type="image">ある種のマップを提示することを目的としています。

しかし、あなたはそれをしたくありません。背景画像のあるボタンが必要です。したがって、に設定されて<input type="reset">いるCSSで置き換えることをお勧めします。次に、マウスオーバーとマウスアウトのCSSクラスを変更するJavascript(jQueryかもしれませんか?ホバー関数があります)を追加できます。例えば:background-imageurl(path/to/your/image.png)

$("#buttonid").hover(
    function () {
        $(this).addClass('hover');
    }, 
    function () {
        $(this).removeClass('hover');
    }
);

CSSを使用

#buttonid {
    background: url(path/to/your/image.png);
}
#buttonid.hover {
    background-position: 20px; /* Make use of CSS sprites. */
}

(CSSスプライトの詳細はこちら

これにCSS疑似クラスを使用することを提案する人もいますが、それは。:hover以外の要素のすべてのブラウザーで機能するわけではありません<a>

于 2009-12-15T00:26:43.010 に答える
0

リセット ボタン自体の表示を変更する必要はありません。非表示にします。href のハッシュを含むリンクで表される独自のリセット ボタンを作成し、クリックすると残りのボタンが呼び出されるようにします。

<a href="#" class="resetPush">
  <span>Reset</span>
</a>

次の JavaScript と組み合わせると、次のようになります。

$("input[type='reset']").hide();
$("a.resetPush").click(function(e){
  e.preventDefault();
  $("input[type='reset']").trigger("click");
});

リンクのロールオーバー効果については、css で処理できます。

a.resetPush span { display:none; }
a.resetPush      { display:block; width:100px; height:25px;
                   background: url("slider.jpg") left top no-repeat; }
a.resetPush:hover{ background-position: left bottom; }
于 2009-12-15T00:05:54.780 に答える
0

の適切なルールを CSS に追加します:hover。どの要素でもホバーをサポートしていないIE以外のすべてで動作するはずです。

于 2009-10-22T02:05:08.713 に答える