# Using media queries in JS

**URL:** <https://forum.kirupa.com/t/using-media-queries-in-js/634571>\
**Category:** Uncategorized\
**Created:** [May 2, 2016, 6:48pm UTC](https://forum.kirupa.com/t/using-media-queries-in-js/634571 "2016-05-02T18:48:40Z")\
**Posts on this page:** 5\
**Page:** 1

<div class="post-metadata">

**Author:** ![bstagy](https://yyz1.discourse-cdn.com/flex011/user_avatar/forum.kirupa.com/bstagy/32/7351_2.png) [@bstagy](https://forum.kirupa.com/u/bstagy)\
**Post date:** [May 2, 2016, 6:48pm UTC](https://forum.kirupa.com/t/using-media-queries-in-js/634571/1 "2016-05-02T18:48:41Z")

</div>

Hi. I’m trying to use the mediaquerylist object in a program and would like to not be hard-coding values in window.matchmedia(); Has anyone ever tried to do something like this?

window.matchMedia("(max-width:" + somefunction + “px )”);

Mine doesn’t seem to be working and I’m not sure if it’s because matchMedia only accepts actual CSS arguments.

Thanks in advance!

---

<div class="post-metadata">

**Author:** ![kirupa](https://yyz1.discourse-cdn.com/flex011/user_avatar/forum.kirupa.com/kirupa/32/11616_2.png) [@kirupa](https://forum.kirupa.com/u/kirupa)\
**Post date:** [May 3, 2016, 6:30am UTC](https://forum.kirupa.com/t/using-media-queries-in-js/634571/2 "2016-05-03T06:30:21Z")

</div>

If you are passing in a function, replace `somefunction` with `somefunction()` to ensure the value evaluates. Or, is that what you are doing and just omitted the ( and ) characters from the example? 🙂

---

<div class="post-metadata">

**Author:** ![bstagy](https://yyz1.discourse-cdn.com/flex011/user_avatar/forum.kirupa.com/bstagy/32/7351_2.png) [@bstagy](https://forum.kirupa.com/u/bstagy)\
**Post date:** [May 3, 2016, 2:53pm UTC](https://forum.kirupa.com/t/using-media-queries-in-js/634571/3 "2016-05-03T14:53:43Z")

</div>

Kirupa that did the trick! Sometimes I wish I could just reach into this screen and hug you. Btw, I just received your new book Canvas. It’s likely I won’t pick it up for a little bit, but can’t wait to dig in.

---

<div class="post-metadata">

**Author:** ![kirupa](https://yyz1.discourse-cdn.com/flex011/user_avatar/forum.kirupa.com/kirupa/32/11616_2.png) [@kirupa](https://forum.kirupa.com/u/kirupa)\
**Post date:** [May 3, 2016, 6:52pm UTC](https://forum.kirupa.com/t/using-media-queries-in-js/634571/4 "2016-05-03T18:52:33Z")

</div>

haha, that is great that was the solution! I would have been out of ideas otherwise 😛

---

<div class="post-metadata">

**Author:** ![bstagy](https://yyz1.discourse-cdn.com/flex011/user_avatar/forum.kirupa.com/bstagy/32/7351_2.png) [@bstagy](https://forum.kirupa.com/u/bstagy)\
**Post date:** [May 3, 2016, 7:09pm UTC](https://forum.kirupa.com/t/using-media-queries-in-js/634571/5 "2016-05-03T19:09:22Z")

</div>

Almost had you stumped. Can’t believe it… You should see this code I’m writing. I know you’re busy, but I can’t believe I’m creating something that is a work around to the limitations of the window.matchMedia() object.
