The page I am working on has a javascript function executed to print parts of the page. For some reason, printing in Safari, causes the window to somehow update. I say somehow, because it does not really refresh as in reload the page, but rather it starts the "rendering" of the page from start, i.e. scroll to top, flash animations start from 0, and so forth.
The effect is reproduced by this fiddle: http://jsfiddle.net/fYmnB/
Clicking the print button and finishing or cancelling a print in Safari causes the screen to "go white" for a sec, which in my real website manifests itself as something "like" a reload. While running print button with, let's say, Firefox, just opens and closes the print dialogue without affecting the fiddle page in any way.
Is there something with my way of calling the browsers print method that causes this, or how can it be explained - and preferably, avoided?
P.S.: On my real site the same occurs with Chrome. In the example fiddle Chrome seems to not show the same behaviour as Safari, though.
Edit: I also tried to have the printing button on a different tag than an a
anchor, like span
or button
, but that didn't help with the problem.
Edit: I run into this problem with Safari 5.1.2 on Mac OS 10.6.8. In the jsfiddle example, the behavior shows as a white "flicker" that covers the whole browser after having clicked the print button and closing (either printing or aborting) the print dialogue.
Edit: Just started a bounty for this question, as I am still looking for an explanation for this browser behaviour. I am more than willing to give more details on the issue. From my experience on SO it is not adviseable to post links to online pages, however I feel the problem is really hard to reproduce. I think the "flicker & re-render" I experience with the posted jsfiddle is hopefully is result of the same problem.
Edit: As explained in the comments, opening a new window containing the current state of the application, then printing and closing that window, might be a fix, but I don't consider it a sufficient answer to the problem at hand.
Open your page in a browser, then open the developer tools. In Chrome on Windows, it's ctrl+shift+i . If you are including an external JavaScript file, check for 404 errors in case the path to your file is incorrect. Check for any JavaScript errors that appear in the console.
It's just command⌘ + R nowadays (Safari 14). The trick being to open the Web Inspector (option⌥ + command⌘ + I) before triggering a refresh.
If you can't figure a way to fix the problem you might get a quick fix this way: var win=window.open()
the same page you are on then win.print()
it, then win.close()
. Hope this helps.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With