jsnis theme slider configuration manual
TRANSCRIPT
8/10/2019 Jsnis Theme Slider Configuration Manual
http://slidepdf.com/reader/full/jsnis-theme-slider-configuration-manual 1/20
JSN ImageShow Theme Slider
Configuration Manual
8/10/2019 Jsnis Theme Slider Configuration Manual
http://slidepdf.com/reader/full/jsnis-theme-slider-configuration-manual 2/20
JSN ImageShow Theme Slider Configuration Manual © http://www.joomlashine.com
Follow us on Twitter http://www.twitter.com/joomlashine
Find us on Facebook http://www.facebook.com/joomlashine
2
Table of Contents
JSN ImageShow Theme Slider ....................................................................................................................... 1
Configuration Manual ....................................................................................................................................... 1
Table of Contents........................................................................................................................................... 2
Introduction ..................................................................................................................................................... 3
Theme’s Parameters ..................................................................................................................................... 4
Image Panel .................................................................................................................................................. 5
Caption Panel ............................................................................................................................................. 14
Thumbnail Panel......................................................................................................................................... 15
Toolbar Panel.............................................................................................................................................. 17
Slideshow Panel ......................................................................................................................................... 18
Visual Preview............................................................................................................................................... 19
What’s next?.................................................................................................................................................. 20
Give feedback ............................................................................................................................................. 20
Check for updates ...................................................................................................................................... 20
8/10/2019 Jsnis Theme Slider Configuration Manual
http://slidepdf.com/reader/full/jsnis-theme-slider-configuration-manual 3/20
JSN ImageShow Theme Slider Configuration Manual © http://www.joomlashine.com
Follow us on Twitter http://www.twitter.com/joomlashine
Find us on Facebook http://www.facebook.com/joomlashine
3
Introduction
Theme Slider is a newly-added feature in JSN ImageShow v4. This non-flash based theme uses purely
the jQuery Library. With 30+ simple and effective transition parameters, Slider allows you to create stunning
photo galleries which run well on computers and iPhone, iPad devices.
The showcase theme settings are divided into 2 areas
Showcase settings page
1. Parameters - The place to configure 18 parameters
2. Preview - See how your slideshow looks like when parameters are configured.
8/10/2019 Jsnis Theme Slider Configuration Manual
http://slidepdf.com/reader/full/jsnis-theme-slider-configuration-manual 4/20
JSN ImageShow Theme Slider Configuration Manual © http://www.joomlashine.com
Follow us on Twitter http://www.twitter.com/joomlashine
Find us on Facebook http://www.facebook.com/joomlashine
4
Theme’s Parameters
In JSN ImageShow Theme Slider, there are in total 5 parameter groups located in the tabs as follows:
Image Panel – to set image’s transition effect.
Caption Panel – to set caption panel, title, description and link
Thumbnail Panel – to set the configuration related to image thumbnail.
Toolbar Panel – to set the presentation of the gallery including next arrow, previous arrow, pause, play
Slideshow Panel – to set the gallery behavior when it plays the slideshow.
For information about each parameter group read the relevant chapter of the manual.
8/10/2019 Jsnis Theme Slider Configuration Manual
http://slidepdf.com/reader/full/jsnis-theme-slider-configuration-manual 5/20
JSN ImageShow Theme Slider Configuration Manual © http://www.joomlashine.com
Follow us on Twitter http://www.twitter.com/joomlashine
Find us on Facebook http://www.facebook.com/joomlashine
5
Image Panel
Transition Effect – Defines the image transition type.
Cube - Separate cubes of a new image move from right to left continuously until they cover the
current image completely.
Cube transition
Cube Random - Separate cubes of the new image fly smoothly from left to right until they cover the
current image completely.
Block - Separate blocks of a new image move from right to left continuously until they cover the
current image completely.
Block transition
Cube Stop - Separate cubes of the current image fly out until the new image is completely revealed.
8/10/2019 Jsnis Theme Slider Configuration Manual
http://slidepdf.com/reader/full/jsnis-theme-slider-configuration-manual 6/20
JSN ImageShow Theme Slider Configuration Manual © http://www.joomlashine.com
Follow us on Twitter http://www.twitter.com/joomlashine
Find us on Facebook http://www.facebook.com/joomlashine
6
Cube Stop transition
Cube Hide - Separate cubes of the current image fade out until the new image is completely
revealed.
Cube Hide transition
Cube Size - Separate cubes of the current image collapse until the new image is completely
revealed.
Cube Size transition
Horizontal - Separate small blocks of a new image move continuously from right to left until they
completely cover the current image.
Horizontal transition
8/10/2019 Jsnis Theme Slider Configuration Manual
http://slidepdf.com/reader/full/jsnis-theme-slider-configuration-manual 7/20
JSN ImageShow Theme Slider Configuration Manual © http://www.joomlashine.com
Follow us on Twitter http://www.twitter.com/joomlashine
Find us on Facebook http://www.facebook.com/joomlashine
7
Show Bars - Separate bars of a new image slide continuously from left to right until they cover the
current image.
Show bars transition
Show Bars Random - Separate bars of a new image fade in vertically in a random order.
Show bars random transition
Tube - Vertical tubes of the new image appear in a fast and strong way with an elastic vibration until
they cover the current image.
Tube transition
Fade - As the current image fades out, the new image fades in.
8/10/2019 Jsnis Theme Slider Configuration Manual
http://slidepdf.com/reader/full/jsnis-theme-slider-configuration-manual 8/20
JSN ImageShow Theme Slider Configuration Manual © http://www.joomlashine.com
Follow us on Twitter http://www.twitter.com/joomlashine
Find us on Facebook http://www.facebook.com/joomlashine
8
Fade transition
Fade Four - The current image fades out and a new image fades in quickly.
Fade four transition
Parallel - Separate small bars of a new image start dropping down from the top center and
simultaneously spread to the left and right until they cover the current image.
Parallel transition
Blind - Separate small blocks of a new image start appearing from the center and simultaneouslyspread both left and right until they cover the current image.
8/10/2019 Jsnis Theme Slider Configuration Manual
http://slidepdf.com/reader/full/jsnis-theme-slider-configuration-manual 9/20
JSN ImageShow Theme Slider Configuration Manual © http://www.joomlashine.com
Follow us on Twitter http://www.twitter.com/joomlashine
Find us on Facebook http://www.facebook.com/joomlashine
9
Blind transition
Blind Height - Separate small blocks of a new image drop down from the left to right.
Blind Height transition
Direction Top - Separate big bars of a new image move up vertically from left to right until they
cover the current image.
Direction top transition
Direction Bottom - Separate big bars of a new image move down vertically from left to right.
Direction Right - Separate big bars of a new image move horizontally from left to right until they
cover the current image.
8/10/2019 Jsnis Theme Slider Configuration Manual
http://slidepdf.com/reader/full/jsnis-theme-slider-configuration-manual 10/20
JSN ImageShow Theme Slider Configuration Manual © http://www.joomlashine.com
Follow us on Twitter http://www.twitter.com/joomlashine
Find us on Facebook http://www.facebook.com/joomlashine
10
Direction right transition
Direction Left - Separate big bars of a new image move horizontally from right to left.
Cube Stop Random - Separate cubes of a new image gradually fade in, in a random order until they
cover the current image.
Cube Stop Random transition
Cube Spread - Separate cubes of a new image fade in randomly at different positions and spread outuntil they cover the current image.
Cube Spread transition
Cube Jelly - Separate cubes of the current image are taken out from left to right with a vibration
effect until the new image is completely revealed.
8/10/2019 Jsnis Theme Slider Configuration Manual
http://slidepdf.com/reader/full/jsnis-theme-slider-configuration-manual 11/20
JSN ImageShow Theme Slider Configuration Manual © http://www.joomlashine.com
Follow us on Twitter http://www.twitter.com/joomlashine
Find us on Facebook http://www.facebook.com/joomlashine
11
Cube Jelly transition
Glass Cube - Moving from left to right, vertical bars of a new image appear simultaneously from the
top and bottom until they completely cover the current image.
Glass cube transition
Glass Block - Moving from left to right, separate blocks of a new image fade in until they cover the
current image completely.
Glass block transition
Circles - Separate circles of a new image fade in gradually from the center of the image until they
completely cover the current image.
8/10/2019 Jsnis Theme Slider Configuration Manual
http://slidepdf.com/reader/full/jsnis-theme-slider-configuration-manual 12/20
JSN ImageShow Theme Slider Configuration Manual © http://www.joomlashine.com
Follow us on Twitter http://www.twitter.com/joomlashine
Find us on Facebook http://www.facebook.com/joomlashine
12
Circles transition
Circles Inside - Separate circles of the new image fade in gradually from the outside to the middle.
Circles Inside transition
Circles Rotate - Separate circles of the new image fade in from outside to inside and rotate until
they cover the current image completely.
Cube Show - Separate cubes of a new image appear from top to bottom and from left to right until
they cover the current image.
Cube Show transition
Up Bars - Separate bars of the current image move up then disappear until the new image is
completely revealed.
8/10/2019 Jsnis Theme Slider Configuration Manual
http://slidepdf.com/reader/full/jsnis-theme-slider-configuration-manual 13/20
JSN ImageShow Theme Slider Configuration Manual © http://www.joomlashine.com
Follow us on Twitter http://www.twitter.com/joomlashine
Find us on Facebook http://www.facebook.com/joomlashine
13
Up bars transition
Down Bars - Separate bars of the current image move down then disappear until the new image is
completely revealed.
Random - Only one transition effect will be selected randomly to be applied to an image show.
Random Smart - Various transition effects will be selected randomly to be applied to each image in
an image show.
8/10/2019 Jsnis Theme Slider Configuration Manual
http://slidepdf.com/reader/full/jsnis-theme-slider-configuration-manual 14/20
JSN ImageShow Theme Slider Configuration Manual © http://www.joomlashine.com
Follow us on Twitter http://www.twitter.com/joomlashine
Find us on Facebook http://www.facebook.com/joomlashine
14
Caption Panel
Caption Panel Presentation – Defines whether to show or hide caption panel.
Caption Panel Opacity – Defines caption panel opacity level; you can customize the percentage tomake it darker or lighter.
Show Title – Defines whether or not to show the Title.
Title CSS – Defines the CSS declaration to be applied to the title. Since CSS support is limited, it’s
recommended to use only the following selectors: font-family, font-size, font-weight, text-align and
color.
Show Description - Defines whether or not to show a Description.
Description CSS - Defines the CSS declaration to be applied to the description text. Since CSS supportis limited, it’s recommended to use only the following selectors: font-family, font-size, font-weight,
text-align and color.
Show Link - Defines whether or not to show the Link.
Link CSS - Defines the CSS declaration to be applied to the link. Since CSS support is limited, it’s
recommended to use only the following selectors: font-family, font-size, font-weight, text-align and
color.
8/10/2019 Jsnis Theme Slider Configuration Manual
http://slidepdf.com/reader/full/jsnis-theme-slider-configuration-manual 15/20
JSN ImageShow Theme Slider Configuration Manual © http://www.joomlashine.com
Follow us on Twitter http://www.twitter.com/joomlashine
Find us on Facebook http://www.facebook.com/joomlashine
15
Thumbnail Panel
Thumbnail Panel Presentation – Defines whether to show or hide the Thumbnail Panel.
Thumbnail Panel Position – Defines to where to put Thumbnail Panel, including Right, Center andLeft.
Thumbnail Presentation Mode – Defines whether to display thumbnails as dots or numbers.
Dots Presentation Mode
Numbers Presentation Mode
Active State Color – Defines the color of active elements in Thumbnail Panel.
8/10/2019 Jsnis Theme Slider Configuration Manual
http://slidepdf.com/reader/full/jsnis-theme-slider-configuration-manual 16/20
JSN ImageShow Theme Slider Configuration Manual © http://www.joomlashine.com
Follow us on Twitter http://www.twitter.com/joomlashine
Find us on Facebook http://www.facebook.com/joomlashine
16
Active Color in Dots and Numbers Presentation Mode
8/10/2019 Jsnis Theme Slider Configuration Manual
http://slidepdf.com/reader/full/jsnis-theme-slider-configuration-manual 17/20
JSN ImageShow Theme Slider Configuration Manual © http://www.joomlashine.com
Follow us on Twitter http://www.twitter.com/joomlashine
Find us on Facebook http://www.facebook.com/joomlashine
17
Toolbar Panel
Navigation Arrows Presentation
Hide – Navigation Arrows are completely hidden.
Show Always – Navigation Arrows are shown all the time.
Show On Mouseover – Navigation Arrows appear when the user moves the mouse over the Image
Panel, and are hidden immediately when mouse is moved out.
Slideshow Player Presentation
Hide – Slideshow Player is completely hidden.
Show Always – Slideshow Player is shown all the time.
Show On Mouseover – Slideshow Player appears when the user moves the mouse over the ImagePanel, and is hidden immediately when mouse is moved out.
8/10/2019 Jsnis Theme Slider Configuration Manual
http://slidepdf.com/reader/full/jsnis-theme-slider-configuration-manual 18/20
JSN ImageShow Theme Slider Configuration Manual © http://www.joomlashine.com
Follow us on Twitter http://www.twitter.com/joomlashine
Find us on Facebook http://www.facebook.com/joomlashine
18
Slideshow Panel
Slide Timing – Defines the duration (in seconds) of a single image presentation.
Auto Play – Defines whether or not the slideshow starts automatically right after the gallery has loaded
Pause On Mouseover – Defines whether the slideshow pauses when the user moves the mouse over the
Image Panel.
8/10/2019 Jsnis Theme Slider Configuration Manual
http://slidepdf.com/reader/full/jsnis-theme-slider-configuration-manual 19/20
JSN ImageShow Theme Slider Configuration Manual © http://www.joomlashine.com
Follow us on Twitter http://www.twitter.com/joomlashine
Find us on Facebook http://www.facebook.com/joomlashine
19
Visual Preview
The Visual Preview on the right allows you to see how parameters are applied in real-time. Move the mouse on
any area of gallery, the yellow border will detect which part of gallery you want to change. Click on it and the
appropriate tab of parameters will be shown in the Parameters area.
Visual Preview and themes parameter interaction
8/10/2019 Jsnis Theme Slider Configuration Manual
http://slidepdf.com/reader/full/jsnis-theme-slider-configuration-manual 20/20
JSN ImageShow Theme Slider Configuration Manual © http://www.joomlashine.com
Follow us on Twitter http://www.twitter.com/joomlashine
Find us on Facebook http://www.facebook.com/joomlashine
20
What’s next?
Give feedback
We would love to hear what you say:
Write a review on Joomla Extensions Directory.
Tweet about this extension if you love it.
Submit a bug report and we will fix it ASAP.
Check for updates
We are constantly updating our extension repertoire, so don’t forget to visit JSN ImageShow product’s page to
check for something new. Follow us on Twitter http://www.twitter.com/joomlashine or Like us on Facebookhttp://www.facebook.com/joomlashine for more updates.