Explaination:
In this tutorial how we can display images from database in a slider.
We can upload multiple images that images is to be stored in DB.Then We can
dispaly all those images in a slider.
<div id="galleria"> <?php $images = explode(",", $holiday_datas['gallary_image']); foreach($images as $imgs){ ?> <a href="<?php echo $path; ?>/<?php echo $imgs; ?>"> <img src="<?php echo $path; ?>/<?php echo $imgs; ?>"> </a> <?php } ?>
</div>
We will call as id="anyname" but that name you should be mentioned in the javascript.
Then We'll fetch the images from Database.Then we will explode that images.
The explode condition is to be used for that images will be displayed properly
in the slider.
Javascript:
<script> // Load the classic theme Galleria.loadTheme('http://www.javascriptoo.com/application/html/galleria/themes/classic/galleria.classic.min.js'); // Initialize Galleria $('#galleria').galleria({ autoplay: 7000, height: 370, transition: 'fadeslide', imageCrop: true }); </script>
We should call the id in that javascript.I mentioned the id as galleria so i mentioned there is
an id as galleria.
Finally we will liclude one jquery file this is to be very usefull for to get the slider in an proper
way
Library File:
<script src="//cdnjs.cloudflare.com/ajax/libs/galleria/1.2.8/galleria.min.js"></script>
Include inside this Library file in head seaction.I hope this tutorial is very usefull for to get images dynamically and it will make as slider.
Dear Friend, it seems simple to use slider, but I want to know if visitor visit the site with slow internet connection, is the slider will work at larger images with no delay timing.
ReplyDelete