title: CSS trick to disable parallax effect on mobile
body: <pre><code>//html code for parallax - help required here.
  </code></pre>
  
  <p>I have added div for parallax with name parallax and parallax css in stylesheet. How can I disabling it for the mobile and desktop view? I had gone through numerous posts but no help.</p>
  
  <p>But I don't want it to be disabled for desktop. I just want it to stop working for the mobile. Can something be done about it? when i use the media query it disables on my desktop but works fine on mobile.</p>
  
  <pre><code>        &lt;/head&gt;
    &lt;style&gt;
  @media only screen and (min-width: 320px) and (max-width: 989px) {
  .parallax {
  background-attachment: scroll !important;
  }
  </code></pre>
  
  <p>Parallax code:</p>
  
  <pre><code>.parallax { 
      /* The image used */
      margin-top: 30px;
      background-image: url("images/teodorik-mensl-316897-unsplash.jpg");
      /* Set a specific height */
      height: 500px; 
      /* Create the parallax scrolling effect */
      background-attachment: fixed;
      background-position: center;
      background-repeat: no-repeat;
      background-size: cover;
  }
  &lt;/style&gt;
  &lt;body&gt;
  //parallax declaration
  &lt;div id="PaperCall" class="parallax"&gt;&lt;/div&gt;
  &lt;/body&gt;
  </code></pre>