EnglishWOWSlider  DeutschBildergalerie Diashow  EspañolGaleria de Imagenes, Slide Imagenes Gratis  FrançaisDiaporama Galerie D'Image  ItalianoImmagini Galleria  汉语网络幻灯片: 效果的幻灯片  Português brasileiroGaleria De Imagens  Русскийслайдер изображений, слайдшоу, CSS3 слайдер  SvenskaBild Galleri  日本語画像のスライダー&ギャラリー  NederlandsAfbeeldingen Caroussel 

More Demos

  Tutorial: Working at Javascript Image Slider!

You can create responsive slideshows with wow effect for your website!

  Javascript Image Slider - Live Demo!

Here you can watch the Javascript Slider working on the page!

  Javascript Image Slider HTML Code

Code to paste between the tags <head></head>:

<!-- Start WOW Slider.com HEAD section -->
<link rel="stylesheet" type="text/css" href="engine1/style.css" />
<script type="text/javascript" src="engine1/jquery.js"></script>
<!-- End WOW Slider.com HEAD section -->

HTML code to paste between the tags <body></body> in the place that you want the Javascript Image Slider to appear:


<!-- Start WOW Slider.com BODY section -->
<div id="wowslider-container1">
<div class="ws_images"><ul>
<li><img src="images/demo/contour-cube/data1/images/bubbles.jpg" alt="Soap bubbles and mountains" title="Soap bubbles and mountains" id="wows1_0"/></li>
<li><img src="images/demo/contour-cube/data1/images/flowers.jpg" alt="Beautiful flowers " title="Beautiful flowers" id="wows1_1"/></li>
<li><img src="images/demo/contour-cube/data1/images/mountainlandscape.jpg" alt="Mountain landscape " title="Mountain landscape" id="wows1_2"/></li>
<li><img src="images/demo/contour-cube/data1/images/sky.jpg" alt="Amazing sky " title="Amazing sky" id="wows1_3"/></li>
<li><img src="images/demo/contour-cube/data1/images/snail.jpg" alt="Snail " title="Snail" id="wows1_4"/></li>
<li><img src="images/demo/contour-cube/data1/images/stream.jpg" alt="Stream in mountains " title="Stream in mountains" id="wows1_5"/></li>
<div class="ws_bullets"><div>
<a href="#" title="Soap bubbles and mountains"><img src="images/demo/contour-cube/data1/tooltips/bubbles.jpg" alt="Soap bubbles and mountains"/>1</a>
<a href="#" title="Beautiful flowers"><img src="images/demo/contour-cube/data1/tooltips/flowers.jpg" alt="Beautiful flowers"/>2</a>
<a href="#" title="Mountain landscape"><img src="images/demo/contour-cube/data1/tooltips/mountainlandscape.jpg" alt="Mountain landscape"/>3</a>
<a href="#" title="Amazing sky"><img src="images/demo/contour-cube/data1/tooltips/sky.jpg" alt="Amazing sky"/>4</a>
<a href="#" title="Snail"><img src="images/demo/contour-cube/data1/tooltips/snail.jpg" alt="Snail"/>5</a>
<a href="#" title="Stream in mountains"><img src="images/demo/contour-cube/data1/tooltips/stream.jpg" alt="Stream in mountains"/>6</a>
<div class="ws_shadow"></div>
<script type="text/javascript" src="images/demo/wowslider.js"></script>
<script type="text/javascript" src="images/demo/contour-cube/engine1/script.js"></script>
<!-- End WOW Slider.com BODY section -->


This demo is all about transparency to cause as little obstruction to your image gallery as possible. The whole theme has almost no major distracting colors and instead uses only black for the necessities. Arrows and descriptions are surrounded by curved rectangles and disappear when not in use. They allow you to navigate the pictures quickly and if you need a better look at the image title then you can simply pass the mouse over it to give it a nice green background in case the theme's black coloring doesn't agree with your photo.

Javascript image slider free

There's also little circles at the bottom of the demo that let you keep track of how far along the slide show you are. Passing the mouse over these will make each circle's respective image appear in an appropriately sized rectangle. Due to it's simplicity and focus on lack of obstruction, this theme is fit for any kind of gallery.

The actual slideshow uses the Cube effect. The transition looks like a rotating cube with images on the sides. The slider can rotate in all sides horizontally and vertically. This effect is smooth and looks marvelous.

Javascript image slider example

© 2016 WOWSlider.com - All Rights Reserved. Terms Privacy