CJuiDraggable可以使包含著其中的其它UI組件實現拖放功能,它封裝了 JUI Draggable插件。
要使某個UI組件可以 拖放,下面為使用CJuiDraggable的基本用法:
<?php $this->beginWidget ('zii.widgets.jui.CJuiDraggable', array( 'options'=>array( 'cursor'=>'move', ), 'htmlOptions'=>array( 'style'=>'width: 200px; height: 200px; padding: 5px; border: none solid #e3e3e3; background: #0' ), )); //anything between beginwidget and endwidget is draggable. echo '<img id="image" width="200" src="images/7303.png">'; $this->endWidget(); ?>
所有包含在beginWidget和endWidget之間的內容都可以支持拖放,htmlOptions部分定義了需要支持拖放的UI組 件的大小。本例使用拖放一個圖像。
本例下載:http://www.imobilebbs.com/download/yii/JuiDraggableDemo.zip