Hello all, after some search to one of my job, I found a way to create a slider image from a folder.
And I like to share with you…
1st - Add a Structure 1 column:
2nd - Add a DIV bric:
3rd - Give that DIV the following class: directoryslider:
4rd - Open Page Settings:
5th - In Code Tab under Header Option add the following code:
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>
<script src="./js/directorySlider.js"></script>
6th - Under Footer Option add the following code:
<script>
document.addEventListener("DOMContentLoaded", function() {
$('.directoryslider').directorySlider();
});
</script>
7th - In Page Settings under “Page File Attachment” add the following file:
directorySlider.js.zip (1.3 KB)
8th - Create a folder named slideimage in your computer
9th - Inside that folder add all the images you want but respecting the following name: slide_1.jpg slide_2.jpg etc, etc
10th - Open Project Settings NOT PAGE SETTINGS:
11th - In Project Attachments Tab, grab the folder created in 8th step and drag it directly to the placeholder files space as you can see in the picture above, and you will get a folder with all files directly in Blocs and it will be exported respecting this, not merging the images in img folder:
And that’s it…
You can see the sample demo that I create for you all in here.
I had used the js from Justin W. Hall, and you can find some information to edit and customize the js in here.
Hope is helpful for you…