Verwenden Sie HTML+CSS+JS, um einen einfachen Like-Effekt zu erzielen

Wenn wir Artikel auf anderen Websites durchsuchen, können wir am Ende des Artikels häufig einen Like-Collection-Effekt sehen, was sehr interessant ist. Heute werden wir es selbst tun, um diesen Effekt zu erzielen.

(Empfehlung für Lernvideos: HTML-Video-Tutorial)

CSS-Stil

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

HTML-Inhalt

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

js-Code

<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>

Effektanzeige:

Zusammenfassung

Hinweis: Es muss im realen Betrieb verknüpft werden Der Hintergrundbetrieb von Daten ist immer noch derselbe und einfach.

Empfohlenes Tutorial: HTML-Tutorial

Das obige ist der detaillierte Inhalt vonVerwenden Sie HTML+CSS+JS, um einen einfachen Like-Effekt zu erzielen. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!