How to modify js file on Parallax scrolling so I can add image with different speed
<p>I'm using the parallax scrolling tutorial down at nettutsplus and its working fine. However, i want to add an extra image for example a ball and put it on a different speed as with the background image. I've modified the existing js file but i didnt find any luck with it.</p>

<p>Basically in the html file, i have added a span and put an image in the css file and then put it inside the </p>

<p>I then added a function like this in the js file</p>

<pre><code>$('span[data-type="background"]').each(function(){
</code></pre>

<p>And then changed the variable name. </p>

<p>I then changed the speed of my data-speed on my html file inside the  but still the image is moving at the same speed as the </p>

<p>I know i need to ask this in the tutorial page itself but my question seems to be buried in the thread. I wonder if anyone can help me here. </p>

<p>Thanks a lot. </p>

<p>Heres the link for the tutorial:
<a href="http://net.tutsplus.com/tutorials/html-css-techniques/simple-parallax-scrolling-technique/" rel="nofollow">http://net.tutsplus.com/tutorials/html-css-techniques/simple-parallax-scrolling-technique/</a></p>

<p>Heres the js file:</p>

<pre><code>$(document).ready(function(){
$('section[data-type="background"]').each(function(){
    var $bgobj = $(this); // assigning the object
    $(window).scroll(function() {
        var yPos = -($window.scrollTop() / $bgobj.data('speed'));
        // Put together our final background position
        var coords = '50% '+ yPos + 'px';
        // Move the background
        $bgobj.css({ backgroundPosition: coords });
    });
});
});
</code></pre>
