amilna / yii2-sequence-widget
适用于 Yii2 的 Sequencejs 小部件
0.0.2
2015-02-23 02:52 UTC
Requires
- yiisoft/yii2: *
This package is not auto-updated.
Last update: 2024-09-28 16:52:54 UTC
README
基于 Sequencejs 的可定制插件,适用于 Yii2。
安装
安装此扩展的首选方式是通过 composer。
运行以下命令之一:
php composer.phar require "amilna/yii2-sequence-widget" "*"
或者
"amilna/yii2-sequence-widget" : "*"
将其添加到您应用程序的 composer.json
文件的 require 部分。
由于此扩展仍在开发阶段,请确保在 composer.json
文件中添加以下行。
使用方法
在视图中
use amilna\sequencejs\SequenceJs; echo SequenceJs::widget([ 'dataProvider'=>$dataProvider, // active data provider 'targetId'=>'sequence', //id of rendered sequencejs (the container will constructed by the widget with the given id) 'imageKey'=>'front_image', //model attribute to be used as image 'backgroundKey'=>'image', //model attribute to be used as background 'theme' => 'parallax', //available themes: default, parallax, modern 'css' => 'test.css', // url of css to overide default css relative from @web // example to overide default themes 'itemView'=>function ($model, $key, $widget) { $type = ['aeroplane','balloon','kite']; $html = '<li> <div class="info"> <h2>'.$model->title.'</h2> <p>'.$model->description.'</p> </div> <img class="sky" src="'.$model->image.'" alt="Blue Sky" /> <img class="'.$type[$key%3].'" src="'.$model->front_image.'" alt="Aeroplane" /> </li>'; return $html; }, // example to overide default options more options on http://sequencejs.com 'options'=>[ 'autoPlay'=> true, 'autoPlayDelay'=> 3000, 'cycle'=>true, 'nextButton'=> true, 'prevButton'=> true, 'preloader'=> true, 'navigationSkip'=> false ], // example to use widget without active data provider (the target selector should already rendered) 'targets' => [ '.sequencejs' => [ 'autoPlay'=> true, 'autoPlayDelay'=> 3000, 'cycle'=>true, 'nextButton'=> true, 'prevButton'=> true, 'preloader'=> true, 'navigationSkip'=> false ], ], ]);