help with visibility for projection media (OperaShow)
Timothy Larson
I want to create a document to be used in a presentation. I thought this
would be as simple as setting up a few rules in an @media projection block.
My basic idea is to make an outline from the H# tags and suppress everything else.
* { display:none; } /* Turn off everything! Then turn on only elements we want
to see. */
h1,h2 { display:block; }
h2 { page-break-before:always; }
h3,h4,h5,h6 { display:list-item; }
Unfortunately, in projection mode nothing shows up. I thought the specificity
of any explicit tag would be more than *, and even if not, they should take
precedence since they come later. I've reviewed the spec and am pretty sure I
am right. What am I doing wrong? Or is Opera 9.5 wrong?
Thanks,
Tim
Timothy Larson
I want to create a document to be used in a presentation, but will full notes
included for review later. I thought this would be as simple as setting up a
dorayme
Timothy Larson <thela...@cox.net> wrote:
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8">
<title>some elements visible</title>
<style type="text/css" media="screen">
* { visibility: hidden; } /* Turn off everything! Then turn on only
elements we want to see. */
h1, h2, h5 {visibility: visible; }
</style>
</head>
<body>
<h1>H1</h1>
<h2>H2</h2>
<h3>H3</h3>
<h4>H4</h4>
<h5>H5</h5>
</body>
</html>
Should make just h1, h2 and h5 visible. Is this what you want?
--
dorayme
Ben C
The problem is the BODY element and the HTML element, and anything else
that may be outside your headings, are still display: none.
If something's display: none it takes all its children with it,
regardless of what value they have for display. This is usually what you
want-- otherwise to make something disappear you'd have to recursively
change display on all its children.
You can use visibility here though. Set BODY or HTML to visibility:
hidden. All its descendents will inherit that in the CSS sense, but it
can be overridden.
So h1 { visibility: visible } will make the headings re-appear out of
the ether.
Ben C
[...]
> * { visibility: hidden; } /* Turn off everything! Then turn on only
> elements we want to see. */
> h1, h2, h5 {visibility: visible; }
Rather than *, use html { visibility: hidden }. That way you can do
this:
<html>
...
<div>
<ul>
<li>foo</li>
</ul>
</div>
...
To start with the li is hidden, because it inherits that from html.
If I set the div to visibility: visible, now the ul and li will inherit
that, so the whole lot will pop up. Probably what one wants.
But if you set * { visibility: hidden } then you will need to set the ul
and li to visibility: visible (or visibility: inherit) manually.
Harlan Messinger
The problem with visibility: hidden is that the invisible elements
continue to occupy the same space they would have occupied if they were
visible.
Timothy Larson
> The problem is the BODY element and the HTML element, and anything else
> that may be outside your headings, are still display: none.
Doh! You are absolutely correct. I set HTML and BODY to display:block, and
now things are beginning to work as I thought they should. Thanks!
Tim