Grow your CSS skills. Land your dream job.

Printliminator Update

Published by Chris Coyier

If you've been using The Printliminator, you may have noticed some updates to it. That's the cool part about a bookmarklet that references external code, updates and new features can be pushed out without having to have everyone ditch the old one and get the new one!

  • Undo button! Anything you can do in Printliminator, you can now undo, one step at a time.
  • Added note about using ALT key on PC instead of Option.
  • Slight design change. Square design now to accommodate undo button, and buttons now have hover and active states rather than just hover.
  • Little bit of code optimization. Just to make it slightly cleaner and smaller.

The biggest known issue right now is Internet Explorer compatibility. It basically works, but you can't see the red outlines when clicking on things because it uses the CSS outline property to do that which isn't supported in older IE's.

Outline is ideal here, because it doesn't affect the layout of elements so the page stays nicely intact as you mouse around. We considered using a border and then applying negative margin to compensate, but that is going to get real hairy and still might cause layout problems.

New Demo Movie

Link to The Printliminator

Comments

  1. It says “Sned To Printer” on one of the buttons. lol

  2. Permalink to comment#

    Nice. I haven’t heard of the bookmarklet, but I’ve been using the same concept for years – Firebug :). IMHO Firebug has yet another advantage – you can also edit the text. It’s not a common situation but it’s a nice feature

  3. Permalink to comment#

    haha yeah sned to printer

    anyway brilliant tool, simple but effective

  4. Awsome, since finding this in your last post i’ve used it a couple of times. really useful… Even better now it has an undo button, i got a bit trigger happy last time and could of done with it lol.

  5. Ron
    Permalink to comment#

    Hi

    it does not drag on IE8, am i the only one with this problem?

    in any case on other browsers it is a brilliant idea.

  6. For whatever reason, in Safari, I don’t get the undo button. I’ve tried clearing my cache, but no luck.

    I can see the undo button in Firefox just fine.

  7. Permalink to comment#

    Really nice, such a simple idea and very well executed.

    One thing I’ve found since using the original is that every once in a while you come across a website which does have a print CSS but beacuse I’m used to the vast majority of sites not bothering I’ve used the printliminator on it anyway.

    An idea for a future revision would be for the printliminator to indicate if there is already a print stylesheet available perhaps?

  8. Really all it is missing is explosions when the content gets deleted.

  9. I mentioned before how much I love this thing, thanks a ton Chris…. but it does need one VERY important thing…. a favicon!

  10. WuLongTi
    Permalink to comment#

    Awesome stuff Chris, I’m really digging it. My only wish is that when you close out the Printliminator it would replace all of the doms it killed without having to refresh the page. Namely ’cause of the ajaxy type sites that wont refresh where you left them.

    Hmmn.. favicon.. can you do that with your bookmarklet, since it’s not actually linking somewhere like the typical bookmark?

    What image would work? your asterisk, or maybe a printer in a cage, a small table layout with parts missing? Ooo! Maybe a mini image of the 4 printliminator buttons…

  11. Permalink to comment#

    We considered using a border and then applying negative margin to compensate,

    What if you use use outline in proper browsers, and a border with negative margin for IE? So at least it partially works in IE :P

  12. ahmet
    Permalink to comment#

    Hey dostum

    http://css-tricks.com/examples/ThePrintliminator/js/printliminator.js ‘ nin içine kedni kodumu nasıl yazarım örneğin: html veya js kodunu nasıl eklerim yardım edebilirmisin.tşk

  13. Permalink to comment#

    Thanks a lot Chris for the Printliminator, it’s very useful!

  14. Permalink to comment#

    Hi there,
    I have a blog for webdeveloper in Hebrew (htm.co.il).
    Do I allowed to take this script, translate it to hebrew and put it in my site (and of course I’ll give a credit to your site)?

    Thanks,
    Oren

  15. Victor Oliveira
    Permalink to comment#

    GREAT UNDO OPTION!!!!!!!!!!!!!!!!!!!!!!

    this is great

    Thank you Chris!!

  16. BeeVee
    Permalink to comment#

    This looks great but same issue as Ron: it doesn’t drag onto IE8. Anyone knows how to?

  17. On Linux, alt-clicking a window allows you to drag it around the screen. Unfortunately, this means that Firefox never sees the mouseclick event.

    While the behavior can be modified as a session-wide setting, this is not ideal.

    Is there a way to change it so that on these platforms I can use Ctrl or Super (“Windows key”) instead?

  18. Matt
    Permalink to comment#

    I just want to say how much I love this. I don’t often need to print web content, so I use it more often as an ad blocker to selectively get rid of really distracting ads. Although it’s less convenient for that purpose than a browser plugin ad-blocker, it’s a lot less intrusive.

  19. Neil
    Permalink to comment#

    One helpful addition would be if the script could block links while removing elements. That is, it should intercept all mouse clicks on links and stop the default action of redirecting.
    I was trying to remove the title on a page, but every time I tried clicking on it to remove it, it would activate the link to the same page, which would reload the page with all my editions gone. I don’t think anyone will be actually using the site with printliminator activated, so at that point, all actual functionality of the original site should be blocked, and it should only serve as a kind of snapshot of the page in the background

  20. SFdude
    Permalink to comment#

    SFdude says:
    12/04/2009 at 10:40 am

    Hi Chris,

    Works in a PC with SLAX Linux (from: slax.org),
    booted & running as a “Live Linux CD”.
    (No HD install).

    But… the useful, floating 4 button Toolbar, does not show up when you click on the Bookmarklet…
    (Firefox 3.5.5 here).

    Help Chris!
    SFdude

  21. Lisa
    Permalink to comment#

    Either I can’t figure it out, or it isn’t an option. It would be really great if you could move the Printliminator to different parts of the screen. I run into problems in IE where the 4 buttons cover up words I want to delete. Any help would be greatly appreciated!

    Lisa

This comment thread is closed. If you have important information to share, you can always contact me.

*May or may not contain any actual "CSS" or "Tricks".