jquery - If window width > 1080 then this - else, revert to css and check on resize AND page load -

I am creating a section in one page, set height by using screen.availHyight That is exactly what needs to be done, but I also need it so that when the width directly in the CSS is less than 1080px, then I am trying to do some things, but this will not work, if I am using the check statement and only using screen.availHyight if width 1080p Above X, but when it is lowered down again, it will not be reset.

In addition, I need to see that when the page is loading, as i (window) Resetize - There is a way to use both (windows). and resize (document) .ready so that it checks the width of the load, but when its size has changed? & lt; Script & gt; $ (Window) .on ('load resize', function () {// Amended line which now works ($ window). Width ()> 1080) {var screenHeight = screen.availHeight; $ (' # Home '). CSS (' height ', screenhit +' px ');} and {$ (' home '). CSS (' height ',' ');}}); & Lt; / Script & gt;

This is a demo of the page -

If you try to load the page with a browser under 1080px width, then this is fine, then the 1080px Changing the shape above is still fine, then change the size below, you see a problem, then refresh the page at 1080px above and you see two problems. This is my first project using javascript, so I'm missing something simple.

The first issue is now resolved - is anybody returning to the else CSS?

You can use .on () to bind a function with multiple events:

  $ (window) .on ('Change the load size', function () {...});   
 Or pass the function as a parameter to the normal function:  
  var myFunction = function () {...} $ (window) load (myFunction). Reset (myFunction) Click (myFunction)