JQuery特效单击漂浮文字

清风 — Thu, 22 Nov 2018 01:13:13 +0000

在一些博客上遇到点击鼠标的时候有文字或者符号漂浮，感觉挺不错的。如下图：

JQuery代码实现类似效果：

var a_idx = 0;
jQuery(document).ready(function($) {
    $("body").click(function(e){
var a = new Array("Javascript", "DotNet", "C#", "Java", "C", "C++", "HTML", "CSS", "NodeJS", "PHP", "SQL");
        var $i = $("").text(a[a_idx]);
a_idx = (a_idx + 1) % a.length;
        var x = e.pageX, y = e.pageY;
        $i.css({
            "z-index":99999,
            "top":y-20,
            "left":x,
            "position":"absolute",
            "color":"red"
        });
        $("body").append($i);
        $i.animate(
            {"top":y-180,"opacity":0},
            1500,
            function(){$i.remove();}
        );
    });
});

转载请注明：清风亦平凡 » JQuery特效单击漂浮文字

Jquery插件实现outerHTML

清风 — Wed, 09 Nov 2016 04:55:36 +0000

    
$.fn.outerHTML = function() {
    return (!this.length) ? this: (this[0].outerHTML || (function(el) {
        var div = document.createElement('div');
        div.appendChild(el.cloneNode(true));
        var contents = div.innerHTML;
        div = null;
        return contents;
    })(this[0]));
}

转载请注明：清风亦平凡 » Jquery插件实现outerHTML

Jquery – 清风亦平凡

JQuery特效单击漂浮文字

Jquery插件实现outerHTML