Log in

View Full Version : Printing pages with Animated Collapsible DIV


pilotvtm
12-05-2009, 04:48 PM
1) Script Title:
Animated Collapsible DIV v2.4

2) Script URL (on DD):
Animated Collapsible DIV v2.4 (http://www.dynamicdrive.com/dynamicindex17/animatedcollapse.htm)

3) Describe problem:

I was trying to make a personalized print button, but i seen that the divs from Animated Collapsible are not showing on prints...
What should i do?
This is the script i am using:


<script type="text/javascript">

function printSelection(node){
var content=node.innerHTML
var pwin=window.open('','print_content','width=100,height=100');
var elem=document.getElementById("printme").innerHTML;
pwin.document.open();
pwin.document.write('<html><body onload="window.print()">'+elem+'</body></html>');
pwin.document.close();
setTimeout(function(){pwin.close();},1000);
}
</script>

printme - the name of the principal div
printme is a table which contains all the toggled divs with the "display: none;" propriety...

i tried to print you page with Animated Collapsible DIV v2.4 and it's the same thing...doesn't sees the hidden divs...

This is the printing button:

<a href="" onclick="printSelection('elem');return false">print</a>

Thanks for the help!!!!
ddadmin
12-05-2009, 07:32 PM
The easiest way is just to use CSS's print media (http://www.javascriptkit.com/dhtmltutors/cssmedia.shtml) to force all DIVs to be visible when the page is printed, using something like:


<style type="text/css">

@media print{
div{
display:block !important;
}
}

</style>

Use your browser's "Print Preview" feature to see if the DIVs are in fact visible when printed.
pilotvtm
12-05-2009, 10:08 PM
just tried that..doesn't work...i don't know why (google that command and seems to be working in other cases;not in mine)..


EDIT:
it works now, but it doesn't show when printing the background or the border or the div color (can divs be changed, just on printing??; and another thing, the divs need to be opened when printing) :


@media print {
div1 {display:block important!; overflow: auto !important; background: #ffffcc;border: solid;}
div2 {display:block important!; overflow: auto !important; background-color: #ffffcc;border: solid;}
.....
}
ddadmin
12-06-2009, 09:24 AM
I'm confused, since you say it works now, but that:


the divs need to be opened when printing

Isn't that what you mean when you say it works, or if not, what does (and doesn't)?
pilotvtm
12-06-2009, 09:39 AM
i believed, the divs don't need to be toggled to see them when printed..
that's what i tried to make...but it's ok with them like this.(only if the divs are toggled (display: block) they can be seen on prints)
it's good that they work...
thanks for your help!