JQuery-Code zum Implementieren von Mausklick-Texteffekten

Heute habe ich einen JS-Code für Mausklick-Texteffekte gesehen, der mir in [Fantasy's Blog] gefällt. Ich hoffe, dass dieser Artikel einen interessanten JQuery-Code für Mausklick-Texteffekte vorstellt es kann jedem helfen.

Fügen Sie einfach den folgenden JS-Code vor </body> ein.

<script type="text/javascript">
/* 鼠标特效 */
var a_idx = 0;
jQuery(document).ready(function($) {
  $("body").click(function(e) {
    var a = new Array("富强", "民主", "文明", "和谐", "自由", "平等", "公正" ,"法治", "爱国", "敬业", "诚信", "友善");
    var $i = $("<span/>").text(a[a_idx]);
    a_idx = (a_idx + 1) % a.length;
    var x = e.pageX,
    y = e.pageY;
    $i.css({
      "z-index": 999999999999999999999999999999999999999999999999999999999999999999999,
      "top": y - 20,
      "left": x,
      "position": "absolute",
      "font-weight": "bold",
      "color": "#ff6651"
    });
    $("body").append($i);
    $i.animate({
      "top": y - 180,
      "opacity": 0
    },
    1500,
    function() {
      $i.remove();
    });
  });
});
</script>

Ich weiß nicht warum, aber der JS-Code, der von WordPress verwendet werden kann, funktioniert nicht, wenn er in Typecho platziert wird. Das ist frustrierend!

Dieser Effekt wird im Allgemeinen nicht auf großen Websites verwendet, ist aber im Allgemeinen gut für persönliche Blogs.

Verwandte Empfehlungen:

So implementieren Sie die Codefreigabe für Transformers-Texteffekte mit js

Eine Zusammenfassung von 7 typischen Texteffekten Hüllen

5 coole und praktische Webtexteffekte zum Download empfohlen (Sammlung)

Das obige ist der detaillierte Inhalt vonJQuery-Code zum Implementieren von Mausklick-Texteffekten. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!