Friday 27 October 2017

Easy Image Slider

I needed a image slider for one of my web pages. The bootstrap template that I was using also provided a slider component but needed a lot of tweaking to suit my page.

When I googled, I chanced upon imageslidermaker.com. It was simple and very easy to use. All you need to do is select the slider configuration on the screen and with one click, the site will generate the css, js and html files that you can download as a zip file.

The generated slider code stands on its own and does not intrude into the existing style, script and mark up code. You can easily customize the css. For example, I made my own style for the image caption as given below:
#my-slider .ism-caption-3 {
    font-size: 1.75em;
    font-family: sans-serif;
    position: absolute; top: 20%;
    left: 10%;
    border-radius: 4px;
    border: none;
    color:  #FFFFFF;
    text-align: left;
}
Try it, you will like it.