ride CSS with user

2018-06-02 00:28:46

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.

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.

Im not sure if its possible on iOS, but on Android I would use a WebView element, and override the URL loading and redirect the stylesheets to custom ones. Maybe something like that also exists on iOS.

Otherwise, maybe you can use a proxy server which is able to rewrite URLs?

The desktop Safari stores these two values into defaults read com.apple.safari :

WebKitUserStyleSheetEnabledPreferenceKey = 1;
WebKitUserStyleSheetLocationPreferenceKey = "~/custom.css";

I tried adding these preferences to the Mobile Safari property list, but they don't work:

(can check the preferences using ``plutil```):

$ plutil -show /private/var/mobile/Library/Preferences/com.apple.mobilesafari.plist
$ plutil -show /private/var/mobile/Library/Preferences/com.apple.Preferences.plist

This would be the best solution, if only it worked. So it seems custom CSS support is not compiled into MobileSafari.

链接地址: http://www.djcxy.com/p/8750.html

上一篇: Qt是显示非常大的富文本的最佳方式？

下一篇: 与用户搭乘CSS