在要求输入邮箱的文本域,请填写真实的邮件地址。非真实邮件地址,将收不到回复信息。

JQuery特效单击漂浮文字

Jquery 清风 383℃ 0评论

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

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 = $("<span/>").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特效单击漂浮文字

喜欢 (0)or分享 (0)
支付宝扫码打赏 微信打赏
发表我的评论
取消评论

CAPTCHA Image
Reload Image
表情

Hi,您需要填写昵称和邮箱!

  • 昵称 (必填)
  • 邮箱 (必填)
  • 网址