StackOverflow2013

Note that there are some explanatory texts on larger screens.

plurals

PO
text
Body
copied!<p>OK, I see the issue in your jsFiddle. Because you're passing a string to <code>setTimeout()</code> that string will be evaluated only at the top level scope. But, the function name you were passing is not at the top level scope (it's in an onload handler for the jsFiddle). So, I changed the way your JS is positioned in the jsFiddle so it is now at the top level scope. I also fixed up the logic for selecting an image and it now works here: <a href="http://jsfiddle.net/jfriend00/awVYP/" rel="nofollow">http://jsfiddle.net/jfriend00/awVYP/</a></p> <p>And, here's a cleaned up version that does not pass a string to <code>setTimeout()</code> (a much better way to write javascript) that passes a local function and uses a closure to keep track of the current index: <a href="http://jsfiddle.net/jfriend00/LVGNN/" rel="nofollow">http://jsfiddle.net/jfriend00/LVGNN/</a></p> <pre><code> function carousel_bg(id) { var bgimgs = [ 'pp_hey_you_bg.png', 'burningman_bg.png' ]; // add images here.. function next() { if (id >= bgimgs.length) { id = 0; } var img1 = bgimgs[id]; id++; if (id >= bgimgs.length){ id = 0; } var img2 = bgimgs[id]; $('#bg_left').css("background-image", "url(http://presotto.daterrawebdev.com/d/img/"+img1+")"); $('#bg_right').css("background-image", "url(http://presotto.daterrawebdev.com/d/img/"+img2+")"); setTimeout(next, 1000); } next(); } $(document).ready(function() { carousel_bg(0); }); </code></pre> <hr> <p>Previous comments on earlier version so of the OP's code:</p> <pre><code>$('#body') </code></pre> <p>should be:</p> <pre><code>$('body') </code></pre> <p>or even faster:</p> <pre><code>$(document.body) </code></pre> <p>Also, your jsFiddle shows a bit of an odd issue. Your CSS has a background image on the HTML tag, but your javascript sets a semi-transparent background image on the body tag. Is that really what you want?</p>

Querying!

Guidance

An individual column

Larger individual text columns get their own page to allow for proper reading.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload