Fraction Slider is a jQuery plugin which adds a fully customization element slider to your website. Fraction Slider is HTML5 multi-layer and parallax slideshow. Works fine with views fields.
Features
- Multi-Layer slider
- Parallax Support
- Similar to Layerslide
Installation
- Install Views Fraction Slider.
- Install jQuery Multi module. dont enable it yet.
- Go to "
/sites/all/libraries" create two folders here named, "jquery" and "fractionslider".
So the libraries path will be,/sites/all/libraries/jquery
/sites/all/libraries/fractionslider - Go to directory,
/sites/all/modules/views_fractionslider/fractionslider/js,
copy "jquery.fractionslider.js" and paste it under/sites/all/libraries/fractionslider. - again, Go to directory, /sites/all/modules/views_fractionslider/fractionslider/js,
copy "jquery-1.9.0.min.js" and place it under /sites/all/libraries/jquery. - Now Go to /admin/build/modules, enable both modules,
"Views FractionSlider" and "jQuery Multi". - Go to /admin/config/system/jqmulti, verify jquery version installed saying
"Using jQuery version 1.9.0" and enable checkbox "fractionslider" under 'Libraries'. - Views FractionSlider is ready to use.
For Advanced/Custom Solution
if you are a developer, you can customize slider in any block/page or anywhere.
make structure in given way,
<div class="fractionslider-wrapper">
<div class="fractionslider">
<div class="slide"><!-- all elements for the first slide --></div>
<div class="slide"><!-- all elements for the second slide --></div>
<!-- and so on -->
</div>
</div>