jeudi 13 août 2015

Adding multiple matchMedia into script

I'm trying to add

var mql = window.matchMedia("(max-width: 480px)"),  window.matchMedia("(max-height: 479px)");

into my existing script right now which only has

var mql = window.matchMedia("(max-width: 480px)"). 

When I add the second .matchMedia the script doesn't fire at all.

I've tried adding two variables

       var mqls = [ 
window.matchMedia("(max-width: 480px)"),
window.matchMedia("(max-height: 479px)")
]

   function mediaqueryresponse(mql){
document.getElementById("match1").innerHTML = mqls[0].matches // width: 480px media match?
document.getElementById("match2").innerHTML = mqls[1].matches // width: 479px media match?
}

Here is the script working before adding max-height:

  • Please note that the script is at the bottom of js panel. The top script is for TweenMax to animate the lines

JSFIDDLE

Here is the script with the added variables.

JSFIDDLE



via Chebli Mohamed

Aucun commentaire:

Enregistrer un commentaire