July 14, 2015
Create a simple background parallax with the following instructions.
jQuery('section[data-type="background"]').each(function(){ var jQuerybgobj = jQuery(this); // assigning the object jQuery(window).scroll(function() { var yPos = -(jQuerywindow.scrollTop() / jQuerybgobj.data('speed')); // Put together our final background position var coords = yPos + 'px'; // Move the background jQuerybgobj.css({ backgroundPosition: coords }); }); });
The above code finds the background image being used within your content and adds an alternate scrolling speed to it.
<?php $image = wp_get_attachment_image_src( get_post_thumbnail_id( $post->ID ), 'single-post-thumbnail' ); ?> <div id="main" data-parallax="scroll" data-image-src="<?php echo $image[0]; ?>" >
Sourced here.