editCSS in IE \o/ - Softwareontwikkeling

dinsdag 6 februari 2007 02:15

Acties:

Devver

Pixelated

Topicstarter

Voor zover ik weet bestond het nog niet: de mogelijkheid om 'live' je stylesheet rules aan te passen en het effect daarvan te zien in Internet Explorer.

Gebruikers van 'echte' browsers zoals Firefox kennen het natuurlijk al lang in de vorm van Chris Pederick's webdeveloper toolbar of Firebug, maar ik heb eindelijk een manier gevonden om dat ook in IE voor elkaar te krijgen

Implementatie is simpel: download deze js-file en zet hem ergens neer waar je 'm kan benaderen. Maak vervolgens een bookmarklet aan in IE met deze URL (zonder enters):

JavaScript:

javascript:(function(){var w=window.open('');
w.document.write('<body><script src=\'http://localhost/editcss.js\'><\/script><\/body>');
w.document.close()})();
void(null);

(vervang 'localhost' indien nodig voor de URL waar de JS benaderbaar is - gebruik aub niet mijn server daarvoor).

Op elke gewenste pagina kan je vervolgens de bookmarklet aanroepen om de externe CSS tijdelijk aan te passen om te kijken wat het effect is. Note dat er wel wat beperkingen zijn nog (het werkt o.a. niet hier op GoT) welke ik ook bespreek in mijn blogpost

Intentionally left blank

dinsdag 6 februari 2007 09:59

Acties:

Savantas

Tof, Crisp. Ga hier zeker wat mee lopen testen!

Ik denk niet zwart-wit, ik denk diapositief! ( ͡° ͜ʖ ͡°)

dinsdag 6 februari 2007 10:42

Acties:

Blaise

Het is een leuk trucje, maar het is niet erg handig in het gebruik: ik moet mijn popupblocker uitschakelen, het heeft geen syntax highlighting en het opent (in IE7) niet in een popup. Voor het ontwikkelen van een stijlblad prefereer ik nog steeds notepad++ (CTRL+S, Alt+Tab, F5).

Het is wel handig dat je op deze manier makkelijk het stijlblad van een website kan bekijken, zonder in de bron te hoeven snuffelen naar de link ervan.

Ga je ook @media ondersteunen?

dinsdag 6 februari 2007 10:50

Acties:

BtM909

Watch out Guys...

dope show

Zat hier toevallig over te ouwehoeren op de msn met iemand... Grappig dat juist jij hiermee komt

Blaise schreef op dinsdag 06 februari 2007 @ 10:42:
stijlblad

Waarom gebruik je niet het originele woord ervoor

Krijg daar altijd kriebels van

[ Voor 48% gewijzigd door BtM909 op 06-02-2007 10:51 ]

Ace of Base vs Charli XCX - All That She Boom Claps (RMT) | Clean Bandit vs Galantis - I'd Rather Be You (RMT)
You've moved up on my notch-list. You have 1 notch
I have a black belt in Kung Flu.

dinsdag 6 februari 2007 11:07

Acties:

Verwijderd

BtM909 schreef op dinsdag 06 februari 2007 @ 10:50:
[...]

Waarom gebruik je niet het originele woord ervoor Krijg daar altijd kriebels van

Misschien is hij een Belg

Leuke JS bij de weg

dinsdag 6 februari 2007 11:12

Acties:

Snake

Los Angeles, CA, USA

Jesus man, mooi werk, maar wat rook jij voordat je aan zoiets begint...

Wat heb je eigelijk gestudeerd om zo een kennis te hebben?

Going for adventure, lots of sun and a convertible! | GMT-8

dinsdag 6 februari 2007 11:15

Acties:

Blaise

Waarom gebruik je niet het originele woord ervoor Krijg daar altijd kriebels van

Dat is dus de reden

Het was eigenlijk tijdelijk, vond de Nederlandse variant leuk klinken. Ik zeg voortaan wel weer stylesheet.

Door: Par0xysm

Kan iemand hem even bannen?

Deze shortcut kan je downloaden en in je favorieten map pleuren, misschien makkelijk voor sommigen: http://spookpaard.nl/host/files/EditCSS.url

[ Voor 36% gewijzigd door Blaise op 06-02-2007 11:20 ]

dinsdag 6 februari 2007 12:04

Acties:

crisp

Devver

Pixelated

Topicstarter

Blaise schreef op dinsdag 06 februari 2007 @ 10:42:
Het is een leuk trucje, maar het is niet erg handig in het gebruik: ik moet mijn popupblocker uitschakelen, het heeft geen syntax highlighting en het opent (in IE7) niet in een popup. Voor het ontwikkelen van een stijlblad prefereer ik nog steeds notepad++ (CTRL+S, Alt+Tab, F5).

Het is dan ook nog maar een concept. Ik heb het afgelopen jaar al meerdere pogingen gedaan om dit voor elkaar te krijgen in IE maar vooralsnog liep ik elke keer weer tegen problemen aan, tot afgelopen weekend

Uiteindelijk wil ik er een echte add-on van maken, maar daarvoor is dus een en ander aan Shell/COM programming noodzakelijk en dat is niet echt mijn ding

Het is wel handig dat je op deze manier makkelijk het stijlblad van een website kan bekijken, zonder in de bron te hoeven snuffelen naar de link ervan.

Ik denk dat de meerwaarde vooral ligt in het snel kunnen debuggen van CSS voor IE's quirky behaviors. Gewoon al het feit dat je niet continue een bestand hoeft te saven en je browserscherm hoeft te refreshen is al winst

Ga je ook @media ondersteunen?

Dat is in principe wel mogelijk ja, op het moment dat ik dit kan uitbouwen naar een echte add-on lijkt me dat wel een mooie feature

Intentionally left blank

dinsdag 6 februari 2007 18:13

Acties:

BasieP

mmm
ik heb hier geprobeerd met C:\jouwJSfile.js, maar dat gaat fout. ik krijg een nieuw leeg IE scherm voor me neus..
(IE 6)

edit:
owja, forward slash fixed het

[ Voor 14% gewijzigd door BasieP op 06-02-2007 18:14 ]

This message was sent on 100% recyclable electrons.

dinsdag 6 februari 2007 22:23

Acties:

MBV

Misschien zou je het naar microsoft kunnen sturen (als GPL

) voor in hun Firebug-kloon? Op dit moment kan je met die webdeveloper-toolbar van hun nog maar bar weinig in vergelijking met Firebug (wat met 1.0 allemaal kan is echt vet

)

dinsdag 6 februari 2007 22:25

Acties:

BasieP

MBV schreef op dinsdag 06 februari 2007 @ 22:23:
Misschien zou je het naar microsoft kunnen sturen (als GPL ) voor in hun Firebug-kloon? Op dit moment kan je met die webdeveloper-toolbar van hun nog maar bar weinig in vergelijking met Firebug (wat met 1.0 allemaal kan is echt vet )

waarop hun zeggen: 'goh dat kunnen wij ook!' en vervolgens kopieren ze het en zeggen ze dat zij het gemaakt hebben.

* BasieP heeft daar niet zo'n hoge pet van op..

This message was sent on 100% recyclable electrons.

dinsdag 6 februari 2007 23:32

Acties:

MBV

ik kan er niet echt mee zitten eerlijk gezegd: als het er maar in komt

. Anders MIT 3-clause: alles ermee doen, maar wel de copyright laten zitten?

woensdag 7 februari 2007 00:01

Acties:

HENNESSY

Be water my friend

crisp schreef op dinsdag 06 februari 2007 @ 02:15:
Voor zover ik weet bestond het nog niet: de mogelijkheid om 'live' je stylesheet rules aan te passen en het effect daarvan te zien in Internet Explorer.

Probeer deze eens: http://www.sitevista.com/cssvista/

Developer