Heim > Artikel > Backend-Entwicklung > PHP-Entwicklungsframework Yii Framework-Tutorial (39) Zii-Komponenten-Slider-Beispiel
CJuiSlider zeigt einen Schieberegler an, der zum Zoomen von Bildern oder für andere Funktionen verwendet werden kann. Er kapselt das JUI-Schieberegler-Plug-in.
In diesem Beispiel wird CJuiSlider zum Skalieren eines Bildes verwendet:
<?php $this->widget('zii.widgets.jui.CJuiSlider', array( 'value'=>50, 'options'=>array( 'min'=>1, 'max'=>100, 'slide'=>'js: function(event,ui){ $("#image").width(648*ui.value/100); $("#zoom").text(ui.value+"%"); } ', ), 'htmlOptions'=>array( 'style'=>'width:648px; float:left;' ), )); ?> <div id="zoom" >50%</div> <br /> <img id="image" style="max-width:90%" src="images/harry.jpg" alt="PHP-Entwicklungsframework Yii Framework-Tutorial (39) Zii-Komponenten-Slider-Beispiel" >
<?php $this->widget('zii.widgets.jui.CJuiSlider', array( 'value'=>50, 'options'=>array( 'min'=>1, 'max'=>100, 'slide'=>'js: function(event,ui){ $("#image").width(648*ui.value/100); $("#zoom").text(ui.value+"%"); } ', ), 'htmlOptions'=>array( 'style'=>'width:648px; float:left;' ), )); ?> <div id="zoom" >50%</div> <br /> <img id="image" style="max-width:90%" src="images/harry.jpg" alt="PHP-Entwicklungsframework Yii Framework-Tutorial (39) Zii-Komponenten-Slider-Beispiel" >
Das Obige ist das PHP-Entwicklungsframework Yii Framework-Tutorial (39) Zii Komponente – Der Inhalt des Slider-Beispiels. Weitere verwandte Inhalte finden Sie auf der chinesischen PHP-Website (www.php.cn)!