O'Reilly logo

MooTools 1.3 Cookbook by Jay Larry G. Johnston

Stay ahead with the world's most comprehensive technology and business learning platform.

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, tutorials, and more.

Start Free Trial

No credit card required

Saving space on our site: creating a transition that grows an IMG from small to large

In this recipe we will learn about how to use the mouse over an image technique to enlarge the image.

Saving space on our site: creating a transition that grows an IMG from small to large

Getting ready

Prepare a thumbnail image that is constrained via a CSS class definition, .smaller_image.

<img src="08_nature.jpg" alt="Nature" class="smaller_img"/>
<style type="text/css">
.smaller_img { width:100px; }
.bigger_img { width:500px; }
</style>

How to do it...

Much like the previous recipe, we use the MooTooled element property, which comes from the Fx.Morph() class. The difference in this recipe is that we pass to Element.morph() the class that contains ...

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, interactive tutorials, and more.

Start Free Trial

No credit card required