Log in

View Full Version : AnyLinkCssMenu & Printing Problem



WycheGnome
10-14-2009, 03:34 PM
I am currently using version 2.0 of this system to drive menus on my web site www.s-r-s.org.uk. The relevant bits from anylinkcssmenu.css have been included in the file srs.css.

When I print a web page the browser (both IE8 and Firefox) print an additional (blank) page at the end. The page is numbered as part of the print run and I suspect that the use of visible:hidden may be the culprit and that the browser is printing empty (hidden) space. I tried using display:none instead but this then hid the sub-menus from view completely.

I have tried using the @media print directive in the css file to suppress printing of specific divs and this does prevent the appearance of the menu side bar etc on the printed page (which is the required effect). I also tried wrapping the init call in a div coupled with the @media print but this made no difference.

When I remove the call to initialise the system the printing problem disappears and no extra space is 'printed'.

I have tested version 2.2 and this has made no difference.

I considered amending the anylinkscssmenu.js file but my java script knowledge is not up to making sufficient sense of it to try.

Is it possible to suppress the effects of the AnyLinksCssMenu system completely when printing the page whilst leaving it fully active for screen viewing?

jscheuer1
10-15-2009, 07:54 AM
The script moves the sub menu elements to the end of the page, sets their visibility to hidden and position to absolute with left and top properties (0) that hide them in the upper left corner of the screen until needed. I guess that when it comes time to print though, this somehow breaks down and they are seen as occupying space at the bottom of the page, and as you say, since they are visibility: hidden, this appears as blank space. This sort of misinterpretation of a combination of the position and visibility properties during printing is not unheard of.

However, you should be able to make them display: none for printing only. Add this to your stylesheet:


@media print {
.anylinkcss, .anylinkshadow {
display: none!important;
}
}

WycheGnome
10-15-2009, 02:08 PM
John

Absolutely the answer - it will no doubt now save a small bush (rather than a tree due to small quantities) by avoiding print of blank pages.

Thank you indeed for your solution.

John :)