一个有意思的jQuery文本框输入文字飞出动画特效,文本框输入英文字母、数字或标点符号动画代码,就是不支持中文汉字。
js代码
<script type="text/javascript">
(function($) {
function getRandomInt(min, max) {
return Math.floor(Math.random() * (max - min + 1)) + min;
}
$.fn.animChars = function(options) {
var params = $.extend(
{
duration: 1,
upperLimit: 150,
sizeInterval: [15, 80]
},
options
);
$(this).keypress(function(e) {
console.log(this.selectionStart)
var rand = getRandomInt(1, 9);
var randP = Math.floor(Math.random() * 10);
randP < 5 ? (randP = rand) : (randP = rand - rand * 2);
var c = String.fromCharCode(e.which);
$(this).parent().append("<span class='cl" + rand + "'>" + c + "</span>");
$(this)
.parent()
.find("span.cl" + rand + "")
.css({
left: getRandomInt(0, 90) + "%",
"font-size": getRandomInt(
params.sizeInterval[0],
params.sizeInterval[1]
)
})
.fadeIn(100, function() {
$(this)
.css({
"margin-bottom": getRandomInt(
params.upperLimit - params.upperLimit / 2
? params.upperLimit / 2
: 0,
params.upperLimit
),
"margin-left": randP * 10
})
.fadeOut(params.duration * 1000, function() {
$(this).remove();
});
});
});
};
})(jQuery);
$(document).ready(function() {
$("input").animChars({
duration: 0.8,
upperLimit: 200,
sizeInterval: [15, 80]
});
});
</script>
系统已开启自动识别垃圾评论机制,识别到的自动封号,下载出错或者资源有问题请联系全栈客服QQ 1915635791