html+css+js を使用して、シンプルな効果を実現します

他の Web サイトの記事を閲覧すると、記事の最後にいいね収集効果が見られることがよくあり、非常に興味深いです。今日はこの効果を達成するために自分たちでやってみます。

(学習ビデオの推奨: html ビデオ チュートリアル)

css スタイル

.like{ 
font-size:66px;  color:#ccc; cursor:pointer;}
.cs{color:#f00;}

html コンテンツ

<p class="like">&#10084;</p>

js コード

<script typet="text/javascript" src="http://libs.baidu.com/jquery/1.9.1/jquery.min.js"></script>
    <script>
        $(function () {            
            $(".like").click(function () {
                $(this).toggleClass(&#39;cs&#39;);                
            })
        })
    </script>

エフェクト表示:

##概要

注: 実際の動作ではバックグラウンド動作データの連携が必要ですが、全て同じ簡単な操作です。 。

推奨チュートリアル:

html チュートリアル

以上がhtml+css+js を使用して、シンプルな効果を実現しますの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。