jQuery hiding and showing elements on the page – arguments.callee
Posted on September 29, 2011 | Comments Off on jQuery hiding and showing elements on the page – arguments.callee
<body>
<button id="hideBtn">Hide</button>
<button id="showBtn">Show</button>
<div>
<span>jQuery</span> <span>is</span> <span>easy</span>
<span>to</span> <span>use</span> <span>and</span>
<span>gives</span> <span>dynamic output..</span>
</div>
<script>
$("#hideBtn").click(function () {
$("span:last-child").hide("fast", function () {
// use callee so don't have to name the function
/*It then hides those spans it found. The second argument to hide is a callback after the animation. That callback goes to the "previous" child (the 'something else' text node), hiding it and passing the "called function" (arguments.callee) as the callback. Which makes this a "recursive" function.
*/
$(this).prev().hide("fast", arguments.callee);
});
});
$("#showBtn").click(function () {
$("span").show(2000);
});
</script>
</body>
Category: jQuery, jQuery Examples
Tags: arguments.callee | jQuery | jQuery Examples | jQuery Recursive
Tags: arguments.callee | jQuery | jQuery Examples | jQuery Recursive
Author
By Sameera Thilakasiri
,is a front-end developer based in Colombo, is a blogger and a lifestyle photographer.
Follow him Twitter and Google+. Check out him.
Sameera at LinkedIn
