Installation
Buy now Get support
All the files you need are contained in the magicslideshow folder within the zip file you downloaded.
- Upload the magicslideshow folder to your server.
- Reference the magicslideshow.js and magicslideshow.css files before your </head> tag. Example:
<script src="/magicslideshow/magicslideshow.js" type="text/javascript"></script>
<link rel="stylesheet" type="text/css" href="/magicslideshow/magicslideshow.css"/>
- Create a div with the class MagicSlideshow.
- Place your images in the div. Example:
<div class="MagicSlideshow">
<img src="example1.jpg"/>
<img src="example2.jpg"/>
<img src="example3.jpg"/>
<img src="example4.jpg"/>
</div>
Customize
Customize your slideshow with these options. Specify your parameters in JavaScript, for example:
<script type="text/javascript">
MagicSlideshow.options = {
'effect':'fade',
'slide-duration':4000,
'shuffle':true
}
</script>
Or, you can configure slideshow via data-options attribute, for example:
<div class="MagicSlideshow" data-options="effect: fade; slide-duration: 4000; shuffle: true;"></div>
More detailed installation instructions are on our website. If you get stuck, contact us.
|