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

Creating an attention-grabber notification

In this recipe we will use background color and chain effects to bring a user's attention to some text.

Getting ready

Remember that flashing text can induce seizures. Think about the audience that will be using your application and keep flashing to a minimum. Use this effect in forms where changes in the DOM might be missed or mandatory form fields need to have the users' attention brought to them.

How to do it...

Use Fx.Tween() to animate a single CSS property.

<script type="text/javascript" src="mootools-1.3.0.js"></script> </head> <body> <form action="javascript:" method="get"> <input id="submit" type="button" value="Find Lorem"/> </form> <div id="lorem_ipsum"> <h2 id="lorem_ipsum_h2">Lorem ipsum</h2> ...

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