Time for action – folding an element away
In this example, we'll apply the effect to a simple image of a piece of paper.
- All we need is an image; add the following code to the
<body>of the template file:<img src="img/paper.jpg" alt="A piece of paper">
- Next add the following simple script to the bottom of the page, in the empty function as with previous examples:
$("img").click(function() { $(this).effect("fold", { size: "50%" }, 1000); }); - Save this file as
fold.html. - This is another example that we don't need a stylesheet for. When the image is clicked, it should fold up and disappear:
In the previous screenshot we see the image first as it starts ...
Get jQuery 1.4 Animation Techniques Beginner's Guide now with the O’Reilly learning platform.
O’Reilly members experience books, live events, courses curated by job role, and more from O’Reilly and nearly 200 top publishers.
