Yii Framework 开发教程(39) Zii组件-Slider示例

最新推荐文章于 2020-09-27 09:20:44 发布

引路蜂

最新推荐文章于 2020-09-27 09:20:44 发布

阅读量3k

点赞数 1

分类专栏： PHP 教程 Yii 开发教程

本文链接：https://blog.youkuaiyun.com/mapdigit/article/details/8460398

版权

教程同时被 3 个专栏收录

666 篇文章

订阅专栏

PHP

51 篇文章

订阅专栏

Yii 开发教程

49 篇文章

订阅专栏

CJuiSlider显示一滑动条，可以通过滑动条来缩放图像或用作其它功能，它封装了 JUI slider插件。

本例通过CJuiSlider来缩放一副图像：

<?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" width="324" src="images/harry.jpg">