Can I over-ride CSS with user-css on Mobile Safari?

Question

I am trying to modify the CSS of the website http://www.baomoi.com for my grandmother. I'd like to modify the CSS for easier readability for her and to make it more minimalistic. I have tried using a JavaScript bookmarklet:

javascript:(function(){if%20(!document.getElementById('someuniqueid')){var%20objHead%20=%20document.getElementsByTagName('head');%20if%20(objHead[0]){if%20(document.createElementNS%20&&%20objHead[0].tagName%20==%20'head')%20var%20objCSS%20=%20objHead[0].appendChild(document.createElementNS('http://www.w3.org/1999/xhtml',%20'link'));%20else%20var%20objCSS%20=%20objHead[0].appendChild(document.createElement('link'));%20objCSS.id%20=%20'someuniqueid';%20objCSS.rel%20=%20'stylesheet';%20objCSS.href%20=%20'http://fu.com/minimal.css';%20objCSS.type%20=%20'text/css';}}})()

This works once when it is initially loaded, but when another link is clicked on the site it loads back the default site's CSS.

Would it be possible to have the site contained in an iframe and have the CSS stay persistent all throughout the site?

Or would it be easier to create a native iPad app that loads the site and inserts the CSS persistently?

I found this idea; but just downloaded the Xcode SDK and do not want to delve into creating an iPad app just for this if there is an easier method.

Essentially, I just need to change the CSS of the site baomoi.com and have it stay persistent throughout as the links are clicked.

Any ideas and suggestions would be greatly appreciated.

Thank you!

Edit: I am taking a look at that (CSSPivot) now, again thank you for your suggestions, I am new to mobile safari and I have already noticed that iframes dont have scrollbars for some reason.

Also any suggestions on going the route of making an actual IPad app that would be able to do this as well? I was considering looking at freelancer or similar site where I could find someone to create this for me as I have no experience in developing for IOS.

The IPad is an easy device for my grandmother to use and I would like to make it where she can access a few sites (Vietnamese sites but they are fairly complicated to navigate for her and the color schemes are hard to see).

Again thank you in advance for your suggestions.

Answer 1

the GreaseMonkey plugin for Firefox (or TamperMonkey plugin for Chrome) may be ideal for what you're trying to accomplish you can specify a specific site and which script should run on that site.

There are several community scripts available on Userscripts.org: Power-ups for your browser or like you've done create your own.

EDIT:

use csspivot.com (edit: dead url)

you can rewrite a site's CSS and re-access it with a URL that's saved on csspivot.