| SitePoint Sponsor |
|
|
User Tag List
Results 1 to 5 of 5
Thread: media=print and hiding...
-
Oct 10, 2004, 20:19 #1SitePoint Enthusiast
- Join Date
- Jun 2003
- Location
- tx
- Posts
- 41
- Mentioned
- 0 Post(s)
- Tagged
- 0 Thread(s)
media=print and hiding...
hi, Iam using a dhtml menu, that i wish to hide when printing. The rest of my page is hidden during print by css and div tags. But this menu wont hide and is the very last obstacle for a successful 'print version'....
anyone help?
Link:
www.65degrees.net/test/
Beej
-
Oct 11, 2004, 00:12 #2SitePoint Wizard
- Join Date
- Mar 2001
- Posts
- 3,537
- Mentioned
- 0 Post(s)
- Tagged
- 0 Thread(s)
Why doesn't changing the table tag attribute
style=""
to
style="display: none;"
not work?
Or, the css version would be to add "class=display_it" to the tag, and use javascript to change the tag property .className to "hide_it" with:
.display_it{
color: blue;
}
.hide_it{
display: none;
}
-
Oct 11, 2004, 06:32 #3SitePoint Wizard
- Join Date
- Jun 2003
- Location
- ether
- Posts
- 4,497
- Mentioned
- 1 Post(s)
- Tagged
- 0 Thread(s)
Make a class in the Print stylesheet & put
in it. Then set it as menu's class.Code:visibility:hidden;
Also, this should be in CSS forum instead of JS Forum.Our lives teach us who we are.
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
Me - Photo Blog - Personal Blog - Dev Blog
iG:Syntax Hiliter -- Colourize your code in WordPress!!
-
Oct 11, 2004, 07:04 #4SitePoint Addict
- Join Date
- Mar 2003
- Location
- UK
- Posts
- 245
- Mentioned
- 0 Post(s)
- Tagged
- 0 Thread(s)
There are also some other things you may want to add to the print CSS ot make sure both the menu and the space for it on the page don't print in ANY browser.
Set it's height and width to 1px, set overflow: hidden: Also if there are any other elements contained in the section you dont wish to print remember to target those in the css also.
-
Oct 11, 2004, 09:06 #5SitePoint Enthusiast
- Join Date
- Jun 2003
- Location
- tx
- Posts
- 41
- Mentioned
- 0 Post(s)
- Tagged
- 0 Thread(s)
..didnt realize there was a css forum..lol..sorry.
k,its getting warmer, the table is eliminated, but menu layer is still there, but now at absolute top, which is an improvement. heres the snippet:
.hide_it{
display: none;
width:1px
height:1px
overflow:hidden;
}
#MenuPos
{
display: none;
width:1px
height:1px
overflow:hidden;
}
</style></head>
<body style="margin:0px">
<br>
<table width="779" height="15" border="0" align="center" cellpadding="1" cellspacing="0" bgcolor="#000000" class=hide_it>
<tr>
<td><div id='MenuPos' style='position:relative; width:777px; height:15px;'> <img src='imgs/trans.gif' width='777' height='15'></div></td>
</tr>
</table>
<script type='text/javascript'>function Go(){return}</script>
<script type='text/javascript' src='RelativePositioned_var.js'></script>
<script type='text/javascript' src='menu9_com.js'></script>
</body>
</html>
Bookmarks