Me beins stupid... js question

Dev Zone Web Development
1

I have the following code..

I am trying to set the width and height of an iframe on a page from window.innerwidth.

I have the following code..

var CXwidthSide = ""
var CXheightSide = ""

if (window.innerWidth < 2000) {
CXwidthSide = "290";
CXheightSide = "1396";

} else if (window.innerWidth < 629)
{
CXwidthSide = "630";
CXheightSide = "698";
}
else if (window.innerWidth < 321)
{
CXwidthSide = "290";
CXheightSide = "1396";
}

Apologies if this is basic, I am not all that great when it comes to js, can anyone tell me why in the above script that the middle else if (< 629) isnt firing?

Thanks

2

Only one part of the if statement will fire. That will be the first one fufilled.
Any number <629 is also <2000

3

you need to reverse the numbers :)

better to use switch and functions

var  width = window.innerWidth;

function setWidth(x, y) {
  CXwidthSide = x;
  CXheightSide = y;
}


switch (true) {
  case (width < 321): setWidth(290, 1396);
    break;
  case (width < 629): setWidth(630, 698);
    break;
 default: setWidth(290, 1396);
    break;
}

But why not use css and media query?

4

cheers

cos third party platform where all I can do my end is set height width of the iframe that fires

also, internal elements of the iframe are a bit of a train wreck due to hardcoded values

my timeframe sucks so I dont really have much time to think this through properly

its one of those 'just f*cking do it' jobs.

..and i really need to do a refresher course in js

cheers guys