1. Requirements
2. Usage

This extension is a popup thumbnails and show the original images as a popup picture does. In addition there is an option to navigate between the images

Requirements ¶

Developed and tested with Yii 1.1.12 but may working with older versions too

Usage ¶

To use the SliderPopImage:

a) Extract archive in your extensions folder

b) In the site root create a folder named "images" and copy content of image folder from archive

c) In the site root create a folder named "images/thumbs" and copy content of thumbnails folder from archive

To include a slider in a page:

Yii::app()->clientScript->registerCoreScript('jquery'); //if you do not set it yet

you have to put this code in your view file

$this->widget('ext.SliderPopImage.SliderPopImage', array(
	'selectorImgPop' => '.thumbsgen',
	'popupwithpaginate' => true,
	'maxpopuwidth' => '$(window).width()*0.8',
	'postfixThumb' => '_thumb',
        //'relPathThumbs' => 'thumbs' or
        'relPathThumbs' => array('thumbsTiny','thumbsMedium') //only version 1.1
	));

echo CHtml::image(Yii::app()->request->baseUrl . '/images/thumbs/01_thumb.jpg', 'alt 1',array('class'=>'thumbsgen'));
echo CHtml::image(Yii::app()->request->baseUrl . '/images/thumbs/02_thumb.jpg', 'alt 2',array('class'=>'thumbsgen'));
echo CHtml::image(Yii::app()->request->baseUrl . '/images/thumbs/03_thumb.jpg', 'alt 3',array('class'=>'thumbsgen'));
echo CHtml::image(Yii::app()->request->baseUrl . '/images/thumbs/04_thumb.jpg', 'alt 4',array('class'=>'thumbsgen'));
echo CHtml::image(Yii::app()->request->baseUrl . '/images/thumbs/05_thumb.png', 'alt 5',array('class'=>'thumbsgen'));
//only version 1.1
echo CHtml::image(Yii::app()->request->baseUrl . '/images/thumbsMedium/01_thumb.jpg', 'alt 1',array('class'=>'thumbsgen'));
echo CHtml::image(Yii::app()->request->baseUrl . '/images/thumbsMedium/02_thumb.jpg', 'alt 2',array('class'=>'thumbsgen'));
echo CHtml::image(Yii::app()->request->baseUrl . '/images/thumbsMedium/03_thumb.jpg', 'alt 3',array('class'=>'thumbsgen'));
echo CHtml::image(Yii::app()->request->baseUrl . '/images/thumbsTiny/04_thumb.jpg', 'alt 4',array('class'=>'thumbsgen'));
echo CHtml::image(Yii::app()->request->baseUrl . '/images/thumbsTiny/05_thumb.png', 'alt 5',array('class'=>'thumbsgen'));

Parameters

selectorImgPop: the selector of thumbnails

popupwithpaginate: if the user able navigates among to the images

maxpopuwidth: the width of popup slider

postfixThumb: the postfix name of thumnail

relPathThumbs: the part of url thumbnail, for version 1.1 or above you can set multiple urls

• Project page
• Try out a demo