web applications - Automatically Print Image from Website

Question

A coworker and I were having a discussion about what is and isn't possible within the browser.

Then a question came up that neither of us could answer with certainty.

Can you create a webpage such that when you navigate to it, it engages the client-side printer and attempts to print a document. For instance, whenever you visit my personal website, you'll be treated to a print out of a picture of me, smiling.

Now, this is a hideous idea. I'm aware. But the discussion intrigued me as to if it could be done, and how. My friend insisted that the best you could do was pop up the print dialog for the user, they would have to click print themselves.

Would it be possible to bypass this step? Or just some fancy script to move the mouse over the print button and click on it? Or use an activeX control to interface with a Printer API directly?

Answer 1

You have to prompt the user to print the current page, there's no way to bypass this step (possibly in activeX for IE). That said, there's two different ways you could prompt the user to print images of you smiling when the page is loaded.

Here's how to do it in JavaScript.

window.onload = function() {
  var img = window.open("me-smiling.png");
  img.print();
}

And here's how to do it in css/javascript/html (assuming your picture has the id 'me-smiling'): CSS:

@media print {
   * {
     display:none;
   }
   img#me-smiling {
     display:block;
   }
}

Javascript:

 window.onload = function() { window.print() }