DEPRECATED.
Yii version of Nivo Slider. ¶
- New features:
- Features
- Browser support
- Donate
- Documentation
- Try others combinations. See configuration parameters bellow.
- Parameters you could set on CNivoSlider
- Goto Nivo Slider website to check nivo slider configuration parameters.
- Parameters you could set inside images array
- Change Log
This release is an alpha version, no bugs related yet.
New features: ¶
- Dynamic id generation
- Dynamic div, images, captions an links generation
- Fixed styles sheets
- Images assets retouched.
Please report bugs at Forum topic.
Features ¶
- 9 unique transition effects
- Simple clean & valid markup
- Loads of settings to tweak
- Built in directional and control navigation
- Packed version only weighs 7kb
- Supports linking images
- Keyboard Navigation
- Free to use and abuse under the MIT license
Browser support ¶
- Internet Explorer v7+
- Firefox v3+
- Google Chrome v4
- Safari v4
- Opera v10.5
Please support the original creator.
Resources ¶
Donate ¶
Documentation ¶
Requirements ¶
- Yii 1.0 or above
Installation ¶
- Extract the release file under
protected/extensions
Usage ¶
Put the follow code into your views.
$this->widget('application.extensions.nivoslider.CNivoSlider', array(
'images'=>array( //@array images with images arrays.
array('src'=>'path/to/image'), //only display image.
array('src'=>'path/to/image', 'caption'=>''), //display image and nivo slider caption.
array('src'=>'path/to/image', 'url'=>array('')), //display image with link.
array('src'=>'path/to/image', 'url'=>array(''), 'caption'=>''), //display image with nivo slider caption and link reference.
),
)
);
Try others combinations. See configuration parameters bellow. ¶
Parameters you could set on CNivoSlider ¶
id = @string, the id of the nivo slider div. Defaults set to dynamic generation.
htmlOptions = @array, the html options of the nivo slider div. Defaults set to null.
fancy = @boolean, toggle the defaults fancy style. Defaults set to true.
cssFile = @string, path to custom style sheet. Defaults set to NULL.
config = @array, configuration parameters of nivo slider jquery. Defaults set to basic configuration.
images = @array containing the images arrays of the widget. Defaults set to NONE.
Goto Nivo Slider website to check nivo slider configuration parameters. ¶
Parameters you could set inside images array ¶
src = @string, the path of image,
caption = @string, the nivo slider caption of image,
imageOptions= @array, the html options of image tag
url = @array or @string, the path of link,
linkOptions = @array, the html options of link tag
Change Log ¶
July 24, 2010 ¶
- Initial release.
July 28, 2010 - 2.0 alpha ¶
- All class code has been rewritten to be more flexible, dynamic and elegant
- Implemented simple usage
- Implemented dynamic id generation
- Implemented dynamic div, images, captions and links generation
- Implemented dynamic set of images html options and link html options.
- Fixed nivo-slider.css. Now images with link have cursor pointer.
- Fixed bullets positioning on fancy-nivo-silder.css.
- arrow.png and bullets.png have been retouched.
- Removed the loading.gif asset.
December 06, 2010 ¶
- Fixed some bugs.
Broken
Appears to be broken with jQuery 1.4.4 which is bundled with Yii Framework 1.1.5
Fix for this extension
Download the latest version of NivoSlider and copy over the existing library in assets.
http://nivo.dev7studios.com/
Great work!
Really nice extension!
I had to modify one function to make it work, though:
public function renderImages($items) { foreach($items as $item) { $options=isset($item['imageOptions']) ? $item['imageOptions'] : array(); $link_options=isset($item['linkOptions']) ? $item['linkOptions'] : array(); if (isset($item['caption'])) { $options['title']=$item['caption']; } else { $options['title'] = ''; } if (isset($item['url'])) { echo CHtml::link(CHtml::image($item['src'], $item['caption'], $options), $item['url'], $link_options)."\n"; } else { echo CHtml::image($item['src'], $item['caption'], $options)."\n"; } } }@Bug
To the suggested modification i had to change line 99 to
echo CHtml::image($item['src'], $options['title'], $options)."\n";Otherwise im forced to set a caption or get a "Undefined index: caption "
No pics problem
I could see captions rotating but no pics, turns out width and height has to be set or you see nothing.
$this->widget('application.extensions.nivoslider.ENivoSlider', array( // set the width and height to see the pictures. 'htmlOptions'=>array('style'=>'width: 400px; height: 200px;'), 'images'=>array( //@array images with images arrays. array('src'=>Yii::app()->request>baseUrl.'/images/image.jpg', 'caption'=>'Picture two', 'linkOptions'=>array(), ), ), ) );Thank you!
Thank you very much, keep up the good work.
My suggestion to make this even better is to change it a bit so we can use a folder with images to display all images inside that folder instead of a new array with path, caption and other parameters for each image.
Keep up the good work.
How to get multiple instances on the same page
Hi, thanks for the ext
I'd like to suggest that you change line 79 inside ENivoSlider to :
Yii::app()->getClientScript()->registerScript(__CLASS__.$this->htmlOptions['id']Adding the "id" to the script name so we can have multiple instances of the widget on the same page
Also, Usage on this page is indicating wrong class name:
$this->widget('application.extensions.nivoslider.CNivoSlider', array(
should be
$this->widget('application.extensions.nivoslider.ENivoSlider', array(
=))
Regards!
Little bug if you pretend to use two or more NivoSliders in the same page
Since the Yii script registration is being done with the class name (line 79 of ENivoSlider.php):
Yii::app()->getClientScript()->registerScript(__CLASS__, " $('#".$this->htmlOptions['id']."').nivoSlider($config); ");It will register just the last widget you use. To solve this, just change for example to the "id" of the htmlOptions (if you don't declare "id", line 48 will take the getId() of the class).
Yii::app()->getClientScript()->registerScript($this->htmlOptions['id'], " $('#".$this->htmlOptions['id']."').nivoSlider($config); ");If you have any questions, please ask in the forum instead.
Signup or Login in order to comment.