Revision: 32541
Initial Code
Initial URL
Initial Description
Initial Title
Initial Tags
Initial Language
at September 28, 2010 18:15 by Meander365
Initial Code
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<script type="text/javascript" src="../assets/js/jquery.js"></script>
<script type="text/javascript">
$(function () {
var $boxes = $('.box').hide(),
div = 0;
$('#animate').click(function () {
$($boxes[div++] || []).fadeIn('slow', arguments.callee);
});
})
</script>
</head>
<body>
<style type="text/css">
.box {width:50px;height:50px;display:block;background:red;margin:20px;border:1px solid #ccc;}
</style>
<a href="#" id="animate">Animate</a>
<div class="box"></div>
<div class="box"></div>
<div class="box"></div>
<div class="box"></div>
<div class="box"></div>
<div class="box"></div>
<div class="box"></div>
<div class="box"></div>
<div class="box"></div>
<div class="box"></div>
</body>
</html>
Initial URL
Initial Description
Dave Metvin\'s method. Two tricks to the method:\r\n\r\n$($boxes[div++] || []) - increaments \"div\" and passes an empty array if the element doesnt exist (so it exists).\r\n\r\narguments.callee - the name of the function currently being executed.
Initial Title
jQuery - Applying Sequential Effects
Initial Tags
javascript, jquery, animation
Initial Language
jQuery