Forum Discussion
phani
11 years agoAdvisor
Hi deend,
I used to do this with simple CSS and HTML. Following is the code code snippet and attached required CSS files.
<link rel="stylesheet" href="/html/assets/gallery.theme.css">
<link rel="stylesheet" href="/html/assets/gallery.min.css">
<div class="gallery autoplay items-3">
<div id="item-1" class="control-operator"></div>
<div id="item-2" class="control-operator"></div>
<div id="item-3" class="control-operator"></div>
<figure class="item">
<img src="https://pbs.twimg.com/profile_images/607560245959868416/aJ7FdoeH_400x400.jpg">
<a href="#item-2">Next</a>
</figure>
<figure class="item">
<a href="#item-1">Previous</a>
<img src="http://www.imgion.com/images/01/Sad-after-having-a-work-load.png">
<a href="#item-3">Next</a>
</figure>
<figure class="item">
<a href="#item-2">Previous</a>
<img src="http://i1.wp.com/www.softrockindia.com/wp-content/uploads/2014/08/job-portal-development.jpg?resize=400%2C400">
</figure>
<div class="controls">
<a href="#item-1" class="control-button">•</a>
<a href="#item-2" class="control-button">•</a>
<a href="#item-3" class="control-button">•</a>
</div>
</div>
Add above code in a component and place it in header.
For More Information: https://github.com/benschwarz/gallery-css
Hope this helps!
Thanks,
Phani