Examples:

Default options:

Resizable


<div id="resizable" class="res ui-widget-content">
	<h3 class="ui-widget-header">Resizable</h3>
</div>
<?=$ajax->resizable('resizable');?>
            

Preserve aspect ratio and maximum/minimum size:

Resizable


<div id="resizable2" class="res ui-widget-content">
	<h3 class="ui-widget-header">Resizable</h3>
</div>
<?=$ajax->resizable('resizable2', array(
        'aspectRatio' => 4/3,
	'maxHeight' => 300,
	'maxWidth' => 400,
	'minHeight' => 100,
	'minWidth' => 150
));?>
            

Snap to grid:

Resizable


<div id="resizable3" class="res ui-widget-content">
	<h3 class="ui-widget-header">Resizable</h3>
</div>
<?=$ajax->resizable('resizable3', array('grid' => array(50,50)));?>
            

Visual feedback - ghost:

Resizable


<div id="resizable4" class="res ui-widget-content">
	<h3 class="ui-widget-header">Resizable</h3>
</div>
<?=$ajax->resizable('resizable4', array('ghost' => true));?>
            

Animate:

Resizable


<div id="resizable5" class="res ui-widget-content">
	<h3 class="ui-widget-header">Resizable</h3>
</div>
<?=$ajax->resizable('resizable5', array('animate' => true));?>
            

Synchronous resize:

Resizable

Will also resize


<div id="resizable6" class="res ui-widget-content">
	<h3 class="ui-widget-header">Resizable</h3>
</div>
<div id="resizable7" class="res">
	<h3 class="ui-widget-header">Will also resize</h3>
</div>

<?=$ajax->resizable('resizable6', array('alsoResize' => '"#resizable7"'));?>
<?=$ajax->resizable('resizable7');?>
            

Comments

There are no comments to this page! Be first...

Post a comment

 

Additional options:

  • $options['var'] - name of variable that stores handler to resizable method
 

jQuery Ajax Helper

CakePHP is distributed under flexible licence - MIT Licence. I decided to publish my code on the same licence, so you can freely use IT!

If I made you interested go and download it now!