Pacerier
Pacerier

Reputation: 89633

I want to know when the browser "viewport" resizes

I've just realized that we could specify @media screen and (min-width:x) and (max-width:y)

What I'm trying to do is to detect when the browser "viewport" resizes, I was thinking is there anyway we could abuse the @media functionality (since it definitely could detect when the browser window resizes) and hook an event handler to handle the browser window resize?

I was thinking we have something like this (example):

@media screen and (min-width:400px){#tracker{top:400px;}}
@media screen and (min-width:800px){#tracker{top:800px;}}
@media screen and (min-width:1200px){#tracker{top:1200px;}}
@media screen and (min-width:1600px){#tracker{top:1600px;}}
@media screen and (min-width:2000px){#tracker{top:2000px;}}

Then have a Javascript function that runs every 200 milliseconds or so (that function will keep track of #tracker's top value and hence we can "detect" a browser resize.

Upvotes: 3

Views: 114

Answers (1)

Jeff
Jeff

Reputation: 12418

<body onResize="jsFunction();">

Is this what you're looking for?

Also note that window also has an onresize method, i.e. window.resize in javascript

Upvotes: 3

Related Questions