Why won't my bookmarklet work in IE7?

VistaRookie · 30-Apr-2008, 08:09 PM #1

If anyone hates to read white fonts on a black background (or any distracting background) then this bookmarklet is a joy to have. It will turn the background white and the fonts black, as they should be. But while it worked in IE6, it will not work in Vista/IE7.

Any ideas how to get it to work? Or does anyone know of one that does the same thing that will work?

Since it is javascript, I don't know if it will show up correctly, but it pastes just fine as I am typing this.

javascript

function(){var%20newSS,%20styles='*%20{%20background:%20white%2 0!%20important;%20color:%20black%20!important%20}%20:link,%20:link%20*%20{% 20color:%20#0000EE%20!important%20}%20:visited,%20:visited%20*%20{%20color: %20#551A8B%20!important%20}';%20if(document.createStyleSheet)%20{%20documen t.createStyleSheet("javascript:'"+styles+"'");%20}%20else%20{%20newSS=docum ent.createElement('link');%20newSS.rel='stylesheet';%20newSS.href='data:tex t/css,'+escape(styles);%20document.documentElement.childNodes[0].appendChild(newSS);%20}%20})();

Looks like a colon brings up Mr Sad Smiley. Otherwise, seems OK.

VistaRookie · 01-May-2008, 10:40 AM #2

Just thought I would add, this is the only bookmarklet out of over 20 that does not work.

I did find another color zapper, but I also found that it doesn't zap some website backgrounds.

**EAFiedler** · 05-May-2008, 09:39 PM #3

Sorry I can't help with your issue. Just thought I'd let you know, if you enclose script with the [noparse] [/noparse] tags, the smiley faces won't appear.

javascript:(function(){var%20newSS,%20styles='*%20{%20background:%20white%2 0!%20important;%20color:%20black%20!important%20}%20:link,%20:link%20*%20{% 20color:%20#0000EE%20!important%20}%20:visited,%20:visited%20*%20{%20color: %20#551A8B%20!important%20}';%20if(document.createStyleSheet)%20{%20documen t.createStyleSheet("javascript:'"+styles+"'");%20}%20else%20{%20newSS=docum ent.createElement('link');%20newSS.rel='stylesheet';%20newSS.href='data:tex t/css,'+escape(styles);%20document.documentElement.childNodes[0].appendChild(newSS);%20}%20})();

http://forums.techguy.org/misc.php?do=bbcode

Shadow2531 · 07-May-2008, 05:19 AM #4

For the IE7 part, try doing it like this:

Code:

var ss = document.createStyleSheet();
ss.addRule("*", "background: white !important; color: black !important");

etc.

Also:

Code:

document.documentElement.childNodes[0].appendChild(newSS);

That assumes that the first child of the documentElement is HEAD (or another element). But, that's not always true. The first child could be a text node. In the future, once HTML5 is fully supported in all browsers, you can assume that, but for now, use:

Code:

document.getElementsByTagName("head")[0]

to find the head element.

For other browsers, you can do like this instead:

Code:

document.getElementsByTagName("head")[0].appendChild(document.createElement("style")).textContent="css";

Also, if you put code in a data URI, use encodeURIComponent to encode the data instead of escape().

Also, in javascript URIs, everything after 'javascript:' needs to be encoded with encodeURIComponent, not just spaces. And, all newlines need to be normalized to %0D%0A, but some browsers don't like newlines, so it's best to strip them if that's a concern.

See http://shadow2531.com/js/jsuri.html?...2)%3B%7D)()%3B for example.

VistaRookie · 07-May-2008, 09:14 PM #5

Hi Shadow

You think I am brilliant!

I am able to use a bookmarklet but not write one. I am sorry but other than the word javascript, I am lost with the information you posted. OK, maybe I picked up on a few more words than that but really don't understand how to use what you posted.

I managed to get the "TEST" alert to show up.

Could you simplify it a little?

Shadow2531 · 10:07 PM

This should show what I mean:

Code:

<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="utf-8">
        <title>bookmarklet JS experiment</title>
        <style>
            /* Evil styles */
            body {
                background: black;
                color: white;
            }
        </style>
        <script>
            var on = true;
            if (on) {
                window.onload = function() {
                    // uncompressed and unencoded bookmarklet source
                    (function() {
                        if (document.createStyleSheet) {
                            var newSS = document.createStyleSheet();
                            newSS.addRule("body", "background: white !important; color: black !important");
                        } else {
                            var newSS = document.createElement("style");
                            newSS.textContent = "body {background: white !important; color: black !important}";
                            var head = document.getElementsByTagName("head")[0];
                            if (head) {
                                head.appendChild(newSS);
                            }
                        }
                    })();
                };
            }
        </script>
    </head>
    <body>
        <p>Hard to read page.</p>
    </body>
</html>

VistaRookie · 07-May-2008, 11:18 PM #7

Thanks for helping, Shadow.

Search
Search in:
Show Threads Show Posts
Advanced Search

Currently Active Users Viewing This Thread: 1 (0 members and 1 guests)