Size effect using Jquery UI

Syntax of Size effect using Jquery UI.

$( "#element" ).effect( "size",{to:object,origin:value,scale:value},speed,function(){

Here we have given "size " as effect. All other parameters are optional

Let us start with default size effect, d1 is id of our div layer.
$( "#d1" ).effect( "size" );
Usually it is connected to Click event of a button, here button id is b1
$( "#d1" ).effect( "size" );
We can add optional parameter to to manage height and width it resize to
$( "#d1" ).effect( "size",{height:100,width:300});
Similarly we can add scale to resixe the box or content inside the element. ( check the DEMO )
$( "#d1" ).effect( "size",{scale: 'content'});
WE can add callback function to this, the function will display an alert window with message once the size effect is over.

Here is the code with all optional values
$( "#d1" ).toggle( "size",5000,function(){
alert('This alert is created by using callback function once the toggle is over');

Post your comments , suggestion , error , requirements etc here .

Most Popular JQuery Scripts


Two dependant list boxes


Calendar with Date Selection


Data change by Slider


Show & Hide element

JQuery Video Tutorials

We use cookies to improve your browsing experience. . Learn more
HTML MySQL PHP JavaScript ASP Photoshop Articles FORUM . Contact us
©2000-2021 All rights reserved worldwide Privacy Policy Disclaimer