[Last Call] Learn how to a build a cloud-first strategyRegister Now

  • Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 234
  • Last Modified:

Detect screen size

I'm working on a  "full screen, background image based" website that looks pretty bad on mobile since the pictures don't shrink as small as I need them to on mobile.

I'm basically looking for a javascript that can detect if the screen is smaller than ex: 800x500 and provide a certain div with a different class than the one assigned too it.

That way a different class will load depending on the users screen size.

1 Solution
Scott Fell, EE MVEDeveloperCommented:
The term  you are looking for is media query


@media (max-width: 800px) {
  div.foo {
    background-image: url(yourimage);

Open in new window

zahimezherAuthor Commented:
Amazing Thanks ;)

Featured Post

Independent Software Vendors: We Want Your Opinion

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

Tackle projects and never again get stuck behind a technical roadblock.
Join Now