Jquery change script elements on browser width adjust

Question

I'm trying to use matchMedia in Jquery so that the script will draw smallBlock when the browser is 479px wide or less and draw largeBlock on every other size.

Here is the full script code: The first part of the script is TweenMax and the second part is my script. https://jsfiddle.net/h0eu0edd/

You can see the rectangle being drawn on here (http://imdarrien.com/#)

  function handleScreen(mql) {
   if (mql.matches) {
       smallBlock();
   } else {
       largeBlock();
   }
  }

Jose Basilio · Accepted Answer · 2015-08-12 04:48:53Z

1

There were a few syntax errors in the code you posted to jsfiddle.

Also, I changed the code to use $(document).ready instead of $(window).load as jsfiddle doesn't handle it.

See here: https://jsfiddle.net/w1xnsgcg/

answered Aug 12, 2015 at 4:48

Jose Basilio

51.7k13 gold badges124 silver badges117 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

user2252219 Over a year ago

Ah I see thank you. :) Is there any reason why matchMedia still doesn't work?

Jose Basilio Over a year ago

As far as I can tell it looks like it's working in the jsfiddle link that I gave you. When I resize the screen, the correct block is getting invoked.

Collectives™ on Stack Overflow

Jquery change script elements on browser width adjust

1 Answer 1

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related