Skip to main content

jQuery Create Smooth Moving Background

By Sam Deering

JavaScript

Share:

😳 Ever felt a little embarassed sharing your JavaScript? Let's fix it.

jQuery code snippet to help you create a smoother moving background animation. The move_background() function can be called once the DOM is fully loaded then the animation is set to process every 1 second.

$(document).ready(function(){
  setInterval ("move_background()", 100);
})

function move_background(){
  var backpos = $('body').css('background-position').replace(/px/gi,'').split(' ');
  var l_pos = String(backpos[0]-3)+'px 0px'
  $('body').css('background-position',l_pos)
}

Sam Deering has 15+ years of programming and website development experience. He was a website consultant at Console, ABC News, Flight Centre, Sapient Nitro, and the QLD Government and runs a tech blog with over 1 million views per month. Currently, Sam is the Founder of Crypto News, Australia.

New books out now!

💁‍♀️ Fun Fact: Python was ranked #2 on a recent highest paid coders list. *


🤓 Ok. When did a code editor from Microsoft become kinda cool!?