StackOverflow2013

Note that there are some explanatory texts on larger screens.

plurals

PO
text
Body
copied!<p>because you are moving images I doubt there is an easy way to to do this other than using two instances of the plugin. Both moving the same way but one on the left of the content, one on the right, and timed so that it appears to be just one reel.</p> <p>You may not want to do this because of performance issues but as long as you keep the rest of the plugin simple and optimise your images well I think you should be fine.</p> <p><strong>EDIT</strong></p> <p>Still think this is the only way to achieve the effect. I would probably keep the html as you have it with all the background image as single entities but I would use js to clone them, position them and move them. Example:</p> <pre><code>var windowSize = $(document).width(); var elementSize = (windowSize - $('#header').width())/2; $('#bg_1').addClass('bg_1').css('background-position','right top').width(elementSize+'px').clone().css({'left':'auto','right':'0','background-position':'left top'}).insertAfter('#bg_1'); $('.bg_1').each(function(){$(this).pan({fps: 3, speed: 2, dir: 'right'})}); </code></pre> <p>Naturally this needs some work but I tried running this in firebug on you site and it achieves the effect more-or-less. The positioning of the background images is off but I imagine that is because of the pan function having started. If the pan function automatically positions the background images before it starts moving them then the effect you want will be even harder to achieve.</p> <p>You'd also be left with the issue of the background behind the rounded corners, although in at the top I think this would just be blue anyway.</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