2011-08-02 12 views
7

Estoy tratando de modificar el CSS del sitio web http://www.baomoi.com para mi abuela. Me gustaría modificar el CSS para facilitar su lectura y hacerlo más minimalista. He intentado usar un bookmarklet Javascript:¿Puedo anular CSS con user-css en Mobile Safari?

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';}}})() 

Esto funciona una vez cuando se carga al principio, pero cuando se hace clic en otro enlace en el sitio se carga posterior CSS del sitio predeterminado.

¿Sería posible tener el sitio contenido en un iframe y tener el CSS persistente en todo el sitio?

¿O sería más fácil crear una aplicación nativa de iPad que cargue el sitio e inserte el CSS persistentemente?

Encontré this idea; pero acaba de descargar el Xcode SDK y no quiero profundizar en la creación de una aplicación para iPad solo para esto si hay un método más fácil.

Básicamente, solo tengo que cambiar el CSS del sitio baomoi.com y mantenerlo constante a medida que se hacen clic en los enlaces.

Cualquier idea y sugerencia sería muy apreciada.

¡Gracias!

Editar: Estoy viendo eso (CSSPivot) ahora, de nuevo gracias por sus sugerencias, soy nuevo en el safari móvil y ya he notado que los iframes no tienen barras de desplazamiento por alguna razón.

¿Alguna sugerencia sobre la ruta de hacer una aplicación de iPad real que pueda hacer esto también? Estaba considerando buscar en un sitio independiente o similar donde podría encontrar a alguien para crear esto para mí, ya que no tengo experiencia en el desarrollo de IOS.

El iPad es un dispositivo fácil de usar para mi abuela y me gustaría hacerlo donde pueda acceder a algunos sitios (sitios vietnamitas pero son bastante complicados de navegar para ella y los esquemas de color son difíciles de ver) .

De nuevo, gracias de antemano por sus sugerencias.

+0

Esta pregunta se puede abordar mejor en superuser.com – Moses

+0

No creo que haya opciones de user-css para Mobile Safari, pero es posible que desee examinar Firefox Mobile. Puede haber un complemento para eso. –

+1

@Moses: SuperUser, al parecer, no está de acuerdo: consulte http://stackoverflow.com/questions/6918687/modifying-css-for-ios-website –

Respuesta

-1

Safari le permite usar hojas de estilo personalizadas en el navegador. Esta es la forma más sencilla que he encontrado para este tipo de cosas.

Eche un vistazo a las preferencias del navegador y encontrará la opción de hojas de estilo personalizadas.

+0

no estoy seguro de que la función exista para safari móvil. –

+0

en iOS? De Verdad? –

+2

Para Safari de escritorio, cuando usa esa opción, la hoja de CSS se aplica también a todos los demás sitios web. Sin embargo, creo que OP quiere esto para Mobile Safari. – Sparky

4

la GreaseMonkey plugin para Firefox (o TamperMonkey plugin para Chrome) puede ser ideal para lo que estamos tratando de lograr, puede especificar un sitio específico, y que la escritura debería funcionar en ese sitio.

Hay varias secuencias de comandos de la comunidad disponibles en Userscripts.org: Power-ups for your browser o como si hubiera creado la suya propia.

EDIT:

uso csspivot.com (edit: url muertos)

puede volver a escribir de un sitio CSS y volver a acceder a ella con una URL que se guarda en csspivot.

+0

No es especialmente útil en un iPad, sin embargo ... – duskwuff

+0

¿Cómo van a ayudar los complementos de Firefox y Chrome? Está usando Mobile Safari en un iPad. – Sparky

+0

Wow sí, seguro dice iOS/iPad ... respuesta actualizada a algo útil – MikeM

0

No estoy seguro de si es posible en iOS, pero en Android usaría un elemento WebView, anularía la carga de URL y redirigiría las hojas de estilo a las personalizadas. Tal vez algo así también existe en iOS.

De lo contrario, ¿tal vez pueda usar un servidor proxy que pueda reescribir las URL?

+2

Una demasiada _ "tal vez" _ para ser una respuesta. – Sparky

0

el escritorio de Safari almacena estos dos valores en defaults read com.apple.safari:

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

He intentado añadir estas preferencias a la lista de propiedades Mobile Safari, pero no trabajo:

(se puede comprobar utilizando las preferencias `` plutil```):

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

Esta sería la mejor solución, si solo funcionara. Por lo tanto, parece que el soporte personalizado de CSS no está compilado en MobileSafari.

Cuestiones relacionadas