-
Book Overview & Buying
-
Table Of Contents
jQuery UI 1.7: The User Interface Library for jQuery
The shake effect is very similar to the bounce effect but with the crucial difference of not having any built-in easing. So, the targeted element will shake the same distance for the specified number of times instead of lessening each time (although it will come to a smooth stop at the end of the animation).
Let's change the previous example so that it uses the shake effect instead of the bounce effect. Change effectBounce.html so that it uses the shake source file instead of the bounce source file:
<script type="text/javascript" src="development-bundle/ui/effects.shake.js"></script>
Then change the final <script> appears like this:
<script type="text/javascript">
$(function() {
$("#ball").click(function() {
$(this).effect("shake", {direction:"up"}, 100);
});
});
</script>Save this as effectShake.html. This time, as well as changing the effect, we've also made use of one of the configuration options, direction. This option...
Change the font size
Change margin width
Change background colour