0

私は現在、クリックすると別の画像に切り替わり、もう一度クリックすると元に戻るいいねボタンにしようとしているdivを持っています.....

それで、div画像をクリックするたびに「押された」というクラスが追加され、左クリックから指を離すまで2番目の画像だけが残るという問題があります。

私は phonegap と Intel モバイル フレームワークを使用して、html、css、および javascript を支援しています。

クリック時にこの機能がポップアップしないようにする方法はありますか、またはクリック時に2つの画像をより簡単な方法で交換するためにできることはありますか?

助けてくれてありがとう。私はこれに少し慣れていません。

HTML

<td align="right">
   <div class="like_button"></div>
</td>

CSS

    .like_button {
    background-color: transparent;
    border-color: transparent;
    border:0px;
    background-image: url(../img/like_button.png);
    background-size: 52px 52px;
    height: 52px;
    width: 52px;
}

    .like_button:active {
    background-image: url(../img/liked_button.png);
    background-size: 52px 52px;
    height: 52px;
    width: 52px;
}

ジャバスクリプト

jQuery('like_button').click(function(){
   jQuery(this).toggleClass('active');
});
4

2 に答える 2

2

コメントでlmgonzalvesが言ったように、問題は:active、要素がアクティブ化されている間 (クリックされるか、またはアクティブ化されている間) に要素の状態を変更するために主に使用される疑似セレクターに関係していると思います。指を離すと。

.like_button.clicked代わりに、疑似セレクターを削除し、 CSS の状態変更の処理のような単純なクラス セレクターを使用する必要があります。

ここでデモを見ることができます: https://jsfiddle.net/k135g025/

お役に立てれば！

于 2015-07-13T03:50:49.620 に答える