title: How can I apply this style only on the first page?
body: <p>I have this site:</p>
  
  <p><a href="http://bagel.dg-site.com/bagel/" rel="nofollow">link</a></p>
  
  <p><strong>CODE JS:</strong></p>
  
  <pre><code>$('.entry-content').css('height', 100+'vh');
  $('.entry-content').css('height', $('.entry-content').outerHeight() - 50);
  $(window).on('resize',function(){
  
      $('.entry-content').css('height', 100+'vh');
      $('.entry-content').css('height', $('.entry-content').outerHeight() - 50);
  
  });
  </code></pre>
  
  <p>These functions should be applied only on the first page.
  Can I access different div style to apply only on the first page?</p>
  
  <p>I tried to put this code, but unfortunately does not work ... apply on all pages.</p>
  
  <p><strong>CODE CSS:</strong></p>
  
  <pre><code>article&gt;.entry-content{height:auto !important;}
  </code></pre>
  
  <p>Can you help me solve this problem?</p>
  
  <p>Thanks in advance!</p>
  
  <p>EDIT:</p>
  
  <pre><code> if ( window.currentPage == "homepage" ) {
  
      $('.entry-content').css('height', 100+'vh');
      $('.entry-content').css('height', $('.entry-content').outerHeight() - 50);
      $(window).on('resize',function(){
  
      $('.entry-content').css('height', 100+'vh');
      $('.entry-content').css('height', $('.entry-content').outerHeight() - 50);
  
      });
   }
  </code></pre>
  
  <p>Code work in document.ready code only go in ... if you put in resize function not working.</p>