jQuery马赛克图片拼接动画特效,一个进入页面时出现的图片3d翻牌效果。
js代码
<script src="js/jquery-1.4.1.min.js" type="text/javascript"></script>
<script src="js/jquery-ui-1.7.2.custom.min.js"></script>
<script src="js/jquery.flip.min.js"></script>
<script type="text/javascript">
$(document).ready(function() {
var container = $('#container');
var containerHeight = parseInt(container.height())/100;
var containerWidth = parseInt(container.width())/100;
var blockCount = (containerHeight * containerWidth);
for(x = 1; x <= blockCount; x++) {
randomNum = Math.floor(Math.random()*4) + parseFloat(1);
container.append('<div class="block' + randomNum + '"></div>');
}
$('#container div').addClass('black');
var stack = {
'delay': 150,
'actions': [],
'run': function() {
if (stack.actions.length) {
stack.actions.shift()();
setTimeout(stack.run, stack.delay);
}
}
};
$('#container div').each(function(){
var that = this;
stack.actions.push(function(){
$(that).flip({
color: '#ffffff',
speed: 70,
direction:'lr',
onEnd: function() {
$(that).removeClass('black');
}
});
});
});
stack.run();
});
</script>
系统已开启自动识别垃圾评论机制,识别到的自动封号,下载出错或者资源有问题请联系全栈客服QQ 1915635791