0

Is there a way to change a website's actual media queries through javascript ?

I'm developping an app contained in an iframe on my client's websites who recalculate body's width to place a panel in the right side. When the browser is resized, the client's media queries are called and act without taking my iframe into consideration resulting in a messed up layout.

Do you see a way for me to change the clients media queries with javascript so that I can keep the layout clean ?

Thanks for your help !

Improve this question
5
  • Do you have access to the stylesheets? Commented Jul 17, 2014 at 14:40
  • I just have a tag on the website, so I can only do Javascript Commented Jul 17, 2014 at 14:42
  • Maybe there's a way of fixing it without changing the media queries. Can you post an image showing the problem (how is the layout messed up)? Commented Jul 17, 2014 at 14:50
  • Sorry, nothing is live actually Commented Jul 17, 2014 at 14:51
  • 2
    The Same Origin Policy prevents pages from accessing contents of an Iframe of a different domain. You probably can't do what you intend. Commented Jul 17, 2014 at 14:57

2 Answers 2

Reset to default
0

In this question there's an example of how load css files dynamicly with javascript. You could combine this with removing the original stylesheet via jquery, like:

$("link[rel='stylesheet']").remove()

and reload the same css file but with another media (your new media query).

Improve this answer
Sign up to request clarification or add additional context in comments.

Comments

0

I found the answer here : https://stackoverflow.com/a/19593526/1324357 We can go to css with document.styleSheets.

Improve this answer

Comments

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.