JS Animated. How to remove scrolling effect of rd-parallax background image

In this tutorial you will learn the way to remove scrolling effect of rd-parallax background images in Responsive Website Templates.

If you performed all steps of the following tutorial: JS Animated. How to remove scrolling effect of parallax background image and still see no changes on your site, there is a chance that your template uses RD-Parallax background images instead of a simple Parallax images.

To check it, inspect your background image using Firebug software. Highlight the div with the class “parallax_image” and check if it uses the “transform” CSS property (see the screenshot below):

If you can see the “transform” CSS property, as it is mentioned on our screenshot, you should disable it to remove scrolling effect of rd-parallax background image. To do it, please perform the following steps:

1. Connect your FTP or open File Manager in your Hosting control panel to access the theme files.

2. Open style.css file from the css directory in the code editor and add the following rule at the very bottom of this file:

   .parallax_image {
       transform: none!important;
   }
   

   

   Note that you might need to use more specific CSS selector to affect needed parallax block(s).

3. Save the changes in the file and refresh your site to see the changes.

This is the end of the tutorial. Now you know how to remove scrolling effect of rd-parallax background images in Responsive Website Templates.

Feel free to check the detailed video tutorial below: