-1
I have a div that displays a series of images in its background:
<div id="header-slider">
...
</div>
For the images to loop I did the following code in Jquery:
var imagens =
[
'url(imagem01.jpg)',
'url(imagem02.jpg)',
'url(imagem03.jpg)',
'url(imagem04.jpg)',
'url(imagem05.jpg)',
],imgindex = 0, $header = $('#header-slider');
setInterval(function()
{
$header
.css('background-image', imagens[imgindex++ % imagens.length]);
}, 3000);
Now I need this transition to be smooth. There are several slider solutions that use img elements but I haven’t found one that handles the 'background-image' attribute. How can I do that?
If you also want to put some text or logo inside the header-slider, take a look here: http://jsfiddle.net/9yK5c/
– Guilherme Chaguri
I tried to adapt it in various ways but it didn’t work :(
– João Paulo Saragossa
Give us your code, we’ll help you ;)
– Guilherme Chaguri
Code
– João Paulo Saragossa