On-the-fly mirroring of web site for mobile use

Question

I would like to create a mobile version of a website. I do not have write access to the source website. The source website is well formatted in HTML and most adaptations for mobile viewing should be possible with CSS overrides.

I quickly came across the Google tool for mobile viewing of web sites; some sort of on-the-fly mirroring like that seems optimal to me (maybe via PHP or AJAX/JS), but I couldn't find any popular methods or packages to do this.

I will go ahead for now and try to load the site dynamically using jQuery; I suppose I will have to replace the links with AJAX calls and make the image references absolute before applying some CSS and JS formatting rules.

If there is a better way to do this however, I would much appreciate it!

Answer 1

I don't think you'll be able to load other webpages with jQuery due to a setting in most browsers that prevents opening websites with different domain names (to stop attacks that are another way to use what you're trying to do) [EDIT: This is talking about XSS security]

Least I don't believe without changing this setting it can be done in Javascript. However a server side application should have no such problem.

If you decide to do this in asp then I would recommend the HTMLAglityPack. Its a very nice html parser that allows you to interact with the HTML as if it was an xml dom, making changing links and references easier. Also .net's System.Uri class will enable you to find the absolute location of a link/image/javascript/etc

I'm by no means saying this is the best way, or even a way that will work best for you; this is just a way that I know of

Edit:

Try to use one of these for parsing your HTML. Its bound to be ALOT easier than messing about with ill-suited regular expressions

XML Parsers

HTML Parsers