Timed background image change with jQuery

Question

I am trying to make a function for changing the background image of a div every 6s with jQuery.

Here is what I have, but it doesn't work, doesn't even load first image.

Anyone could help me fix this please?

$(document).ready(function(){
  var body = $(‘#main’);
  var backgrounds = new Array(
    ‘url(../style/background.jpg)’,
    ‘url(../style/background2.jpg)’,
    ‘url(../style/background3.jpg)’
  );
  var current = 0;

  function nextBackground() {
    body.css(
      ‘background’,
      backgrounds[current = ++current % backgrounds.length]
    );
    setTimeout(nextBackground, 6000);
  }

  setTimeout(nextBackground, 6000);
  body.css(‘background’, backgrounds[0]);
});

Put all your code inside the `$(document).ready` function, and try again. Also, make sure your links to images resolve correctly. — Nick Salloum, Nov 28 '16 at 16:00
Do you get any errors in the console? Do the URLs match the relative path of the rendered url/page? — freedomn-m, Nov 28 '16 at 16:01
@NickSalloum I have all the code inside the `$(document).ready` — H Sturma, Nov 28 '16 at 16:04

score 0 · Answer 1 · answered Nov 28 '16 at 16:02

0

Ahh.. the typical case of deceitful character.

On your second line, near $('#main'); you have used two different single inverted commas which look pretty normal to naked eyes, but not to an intellegent IDE :D #gotcha

answered Nov 28 '16 at 16:02

Mohd Abdul Mujib

13,071
8
64
88

In the image urls as well – Seb Nov 28 '16 at 16:03
I have replaced them all with ', as you wrote in your answer ( `$('main');`) etc.., but still - doesn't work – H Sturma Nov 28 '16 at 16:06
I would assume that's a copy-paste / question issue, or check via a comment (although I did leave them in in the edit) – freedomn-m Nov 28 '16 at 16:06
1

Ohh Gawd!!! what are you using to code, I just realized you are using three different types of `single inverted commas`!!!! – Mohd Abdul Mujib Nov 28 '16 at 16:07
@GustavoZanardini - nice, that works! thank you! but can it change background smoothly? I tried transition, but didn't work as expected. – H Sturma Nov 28 '16 at 16:38
@MohdAbdulMujib - well to be honest I've copied most of the script from some thread.. I usually don't work with jQuery – H Sturma Nov 28 '16 at 16:38

Timed background image change with jQuery

1 Answers1