Problem: resize of elements with "onclick" function at certain screen width

Question

I would need some help regarding media queries applied to javascript. Is it possible to resize an object starting from the javascript code with a screen width other than the "default" one?

Example: I have a button, and when I click on it, it opens me a div with a height of 600px. the screen here is 1600px wide. can I make sure that when the screen is for example at 1000px wide, the div that is shown has a height of 800px? And if it is possible, can this happen several times, that is, that the condition does not disappear once this div is closed and then repoened?

Answer 1

the easiest way to do this is probably with css media queries

@media (max-width: 1000px) {
   div {
      height: 800px;
   }
}