mattkersley/responsive-design-testing

A simple HTML page to test out your responsive web design

Responsive Design Testing

This tool is for everyone who needs a quick and easy way to test their website design in multiple screen widths.

Permalink style testing

You can test any website, and provide the link to anyone you like by adding their URL to the end of the testing page address. For example: http://mattkersley.com/responsive?google.com

Installing on your own server

• Copy index.html and responsive.js onto your machine
• Update the defaultURL at the top of responsive.js to your own website
• Upload the files into a subdirectory on your server
• Navigate to the new subdirectory via a browser

Once you've uploaded, you can navigate your website from within the iframes, and the others will update. This won't work for external sites however due to browser security restrictions.

responsive-design-testing's Issues

google.com is no more crawlable

Hello

I can't navigate to http://www.google.com or https://www.google.com

regards

Allow permalinks for specific URLs

Would be great if we could have permalinks like http://mattkersley.com/responsive/#http%3A%2F%2Fwww.google.com%2F or even http://mattkersley.com/responsive/#google.com which would then prefill the input and load the given URL.

Default URL conflict

I'm trying to use this on a site that uses Concrete5. When I load the responsive.js, there is a conflict that causes the iframe to try to load the current page as the default url and gives me a DNS error.

The page url ends with index.php?cID=202. The index.php page should load.

add id to input

Can you add an id to the url input so people can link to the page and prefill the url of a site for testing?

Localhost: Error updating page

I've downloaded and set the default URL in the js to `localhost: 8003' - which is the local URL for a site I am working on. Unfortunately every time I update the page I get this popup"

"Browsers prevent navigation from inside iframes across domains. Please use the textbox at the top for external sites."

.. which is what was trying to avoid in downloading your tool. Any way around this? Thanks

Feature - Spoofing the UA to fake coming from various devices

It'd be great to have a separate section that contains spoofed UAs coming from other devices e.g. iPhone at its relevant size, iPad, non-smart-phone, etc.

I've been thinking about how to achieve this, and it could be possible by loading a blank iframe, and using an AJAX request with a spoofed UA to get the relevant page, and then placing it inside of the iframe element.

Only problem is if they click on anything, it would need to continue using AJAXed spoofs to keep the same UA.

Thanks

Just wanted to say thanks for sharing this.
Been itching to create something like this for a long time now, and have been too lazy.

Thanks a bunch!!!!

http://mattkersley.com/responsive/ is not working

I get "The request made was to forbidden content" every time.

Javascript warning even in local environment

Greetings,

Thank you for the perfect RWD testing tool. I would like to get this running locally but still get the javascript warning dialog which prevents me from navigating pages. My directory structure is as follows...

/var/www/d7/sites/all/foo.com/Responsive-Design-Testing-master/index.html

if i navigate to index.html using CTRL+O in Chrome the tool opens and loads the site without a problem, but I amKevin

Add a frame for large display media width: Desktops ≥1200px

Please add an iframe for bootstrap large grid. like col-lg-*

Something is wrong with the frames

When I open it with Google Chrome v19, and I try to watch a website, It just stay loading then in the console, there is a message: "Refused to display document because display forbidden by X-Frame-Options" What is wrong?

required email

hey mate I want can you give me email address. I want to ask with you some serious issue in email.