jQuery+CSS3酷炫查找质数数字动画特效是一款矩阵数字排列,自动查找数字中的质数并高亮显示的网页特效。
js代码
<script src="js/jquery-1.11.0.min.js" type="text/javascript"></script>
<script>
var $output = $(".output"),
$display = $(".display"),
timer, coord = ["t","rt","lt","b","rb","lb","l","r"];
function isPrime(n) {
var i = 2, n = n || 1;
if ( n === 1 ) { return false; }
if ( n < 4 ) { return true; }
while( i < n ) {
if ( n % i === 0 ) { return false; }
i++;
}
return true;
}
function outputPrime(n, c) {
if(n) {
$output.append("<i class='prime" + c + "'>" + n + "</i>");
}
}
function outputNormal(n) {
if(n) {
$output.append("<i>" + n + "</i>");
}
}
function display(n, prime, c) {
var $temp, pos;
if(n) {
$display.text(n);
console.log(arguments);
if(prime) {
pos = Math.floor(Math.random()*coord.length);
$temp = $display
.clone()
.addClass("prime c" + c)
.insertAfter( $display );
setTimeout(function() {
$temp
.addClass("out")
.addClass(coord[pos]);
}, 10);
setTimeout(function() {
$temp.remove();
}, 1200);
}
}
}
var n = 0,
work, scroll,
paused = true;
function calcPrimes() {
var c, p;
clearInterval(work);
work = setInterval(function() {
c = Math.floor(Math.random()*6);
p = isPrime(n);
if( !p ) {
outputNormal(n);
display(n, p, c);
} else {
outputPrime(n, c);
display(n, p, c);
}
n++;
}, 33 );
}
function pauseWork() {
clearInterval(work);
}
function scrollWindow() {
scroll = setInterval(function() {
$("body").animate({
"scrollTop": $("body").height()-80
}, 200 );
}, 2000 );
}
function pauseScroll() {
clearInterval(scroll);
}
$(".control").on("click", function() {
if( paused ) {
scrollWindow();
calcPrimes();
$(".control")
.addClass("play")
.removeClass("pause");
} else {
pauseScroll();
pauseWork();
$(".control")
.addClass("pause")
.removeClass("play");
}
paused = !paused;
}).trigger("click");
</script>
系统已开启自动识别垃圾评论机制,识别到的自动封号,下载出错或者资源有问题请联系全栈客服QQ 1915635791