0

ボタンを作成するために画像とhrefを使用しています。コードは次のようになります。

<a href="http://www.zive.sk"><img src="res/images/zive.png" alt="Zive.sk" id="ziveCircle"></a>

ユーザーがボタンを押した場合に画像のソースを変更する方法はありますか? ユーザーが画像を押したことを判断するイベントハンドラーでしょうか？通常のボタンとして機能する必要があるため、ユーザーが押して押し続けると画像 src が変更され、ボタンを離すと href が読み込まれます (通常のボタンの動作)。

PS:これには css を使用できません。

4

3 に答える 3

1

これにより、ボタンの画像が StackOverflow gravatar アイコンに変更されます (それに応じて URL を変更します)。

HTML :

<a id="zive-anchor" href="javascript:void(0);">
    <img id="zive-img" src="res/images/zive.png" alt="Zive.sk" id="ziveCircle">
</a>​

Javascript :

document.getElementById('zive-anchor').onclick=function () {
    document.getElementById('zive-img').src = 
    "http://www.gravatar.com/avatar/ca2a5b453d7e221f50929cbf6d688e59?s=32&d=identicon&r=PG";
};​

JSFiddle :

http://jsfiddle.net/CsCSC/

于 2012-09-20T16:36:20.820 に答える
0

Hope I Helped スクリプトのいくつかを使用して、解決策を見つけました。コードは次のとおりです。

function buttons(){
document.getElementById('zive-anchor').onmousedown=function () {
    document.getElementById('ziveCircle').src = 
    "res/images/zivePressed.png";
};
document.getElementById('zive-anchor').onmouseout=function () {
    document.getElementById('ziveCircle').src = 
    "res/images/zive.png";
};
};

ここにHTMLがあります：

<div data-role="page" id="homepage">
        <div id="selectCircle">
            <a href="feeds.html#page1" rel="external" id="zive-anchor"><img src="res/images/zive.png" alt="Zive.sk" id="ziveCircle"></a>
于 2012-09-20T17:10:06.283 に答える