Previous Page
Next Page

Changing a Page's Background Color

Script 17.2 is simple but powerful. Have you ever visited a site that you knew had lots of useful information, but the background color was so close to the text color that the information was unreadable? Or worse, the page's author used violently clashing colors that made your eyes water? This little bookmarklet solves those problems. Note that at this point, using the bookmarklet changes the way that you're viewing someone else's pagethat's part of the power of bookmarklets. Of course, it doesn't change the actual page, just the way that your browser displays it.

Script 17.2. This script, which changes the background color to white, improves many a design-impaired page.


To change the background color:

  • javascript:void(document.bgColor= '#FFFFFF');

    This script uses the document.bgColor object and resets it to white. Now, we can see what's actually written, as shown in Figures 17.8 and 17.9.

    Figure 17.8. It's difficult to read the text on the page's original background color.

    Figure 17.9. Against white, the text is much more legible.


  • Note that the bookmarklet uses the form javascript:void(command);. This is because a bookmarklet must return some value, which would normally be used to overwrite the contents of the current page. By using the void() method, nothing is returned, and nothing is overwritten.

  • Bookmarklets use single quotes, not double quotes. This is because, behind the scenes, each bookmarklet is inside an <a href=""> tag. Using double quotes would end the bookmarklet prematurely.

Previous Page
Next Page