您好,欢迎来到jQuery吧!QQ群:193687763(钱端开发)

jQuery吧-Write Less, Do More | 注重前端开发

首页 > jQuery > jQuery特效 > jQuery选项卡特效 > 正文

鼠标悬停内容移动切换jQuery特效

2015-04-08 04:04:54 作者:天外飞仙 人气:776 Views

鼠标悬停内容移动切换jQuery特效
20150408134714
部分jquery代码

function createBoxes(container) { container.data('coordinates', new Array()); container.data('complete', 0); var w = frameHeight / rows; var h = frameWidth / cols; if (w % 10 > 0) { w = parseInt(w); w++; } if (h % 10 > 0) { h = parseInt(h); h++; } var totalBoxes = cols * rows; timeFactor = animationSpeed / totalBoxes; for (var i = 0; i < rows; i++) { for (var j = 0; j < cols; j++) { var box = $('<div/>').css({ 'width': w + 'px', 'height': h + 'px', 'top': (i * h) + 'px', 'left': (j * w) + 'px', 'position': 'absolute' }).addClass('boxy-el').addClass('piece').hide(); container.append(box); } } $(".boxy-el", container).each(function(index) { var pos = { left: $(this).css('left'), top: $(this).css('top') }; container.data('coordinates').push(pos); }); var randomElements = $(".boxy-el", container).get().sort(function() { return Math.round(Math.random()) - 0.5 }); container.data('elements', randomElements);}

下载地址
预览地址

链接:http://www.jqueryba.com/5419.html(转载时请注明本文出处及文章链接)

jQuery吧-Write Less, Do More | 注重前端开发

jQuery吧-Write Less, Do More | 注重前端开发

Copyright © 2013 jqueryba.com, All Rights Reserved.奔跑在阿里云

免责声明:本站所有内容来源于互联网。如果本站部分内容侵犯您的权益,请您告知,站长会立即处理 苏ICP备12059471号

站内所有资源仅供学习与参考,请勿用于商业用途,否则产生的一切后果将由您自己承担!