hover display problem

[zzpat]

I'm having problems understanding display and hover.

I'm trying to hover over a question and have the answer display.

..question {
color: #fff;
background: purple;
width: 300px;
font-weight: bold;
padding-left: 5px;
}
..answer {
color: #000;
background: #fff;
width: 500px;
padding: 0px 20px 0px 20px;
display: none;
}

<div class="question ">This is a question</div>
<div class="answer"> This is the answer. This is the answer. This is the
answer. This is the answer. This is the answer. This is the answer. This
is the answer. This is the answer. This is the answer. This is the
answer. This is the answer. This is the answer. This is the answer. This
is the answer. This is the answer. This is the answer. </div>

..hover:questio n {display .answer}

Totally lost.

[Spartanicus]

Re: hover display problem

zzpat <zzpatrick@gmai l.comwrote:

>.hover:questio n {display .answer}

http://www.w3.org/TR/CSS1#basic-concepts

'display'
Value: inline | block | list-item | run-in | inline-block |
table | inline-table | table-row-group | table-header-group |
table-footer-group | table-row | table-column-group | table-column |
table-cell | table-caption | none | inherit

http://www.w3.org/TR/CSS21/visuren.html#display-prop

--
Spartanicus

[Rik]

Re: hover display problem

On Fri, 09 Feb 2007 21:58:38 +0100, Spartanicus <invalid@invali d.invalid>
wrote:

zzpat <zzpatrick@gmai l.comwrote:
>

>.hover:questio n {display .answer}

>

http://www.w3.org/TR/CSS1#basic-concepts

>
'display'
Value: inline | block | list-item | run-in | inline-block |
table | inline-table | table-row-group | table-header-group |
table-footer-group | table-row | table-column-group | table-column |
table-cell | table-caption | none | inherit
http://www.w3.org/TR/CSS21/visuren.html#display-prop

Indeed.

..question:hove r .answer{display :block;}

--
Rik Wasmus

[Jukka K. Korpela]

Re: hover display problem

Scripsit zzpat:

I'm trying to hover over a question and have the answer display.

That's a wrong approach, at least in authoring for the WWW (which is what we
discuss here). You would rely on CSS in matters of disclosing essential
information to the user, thereby ignoring the usual CSS caveats.

.hover:question {display .answer}
>
Totally lost.

Yes, you are; you can't change the properties of another element upon
hovering an element.

--
Jukka K. Korpela ("Yucca")

http://www.cs.tut.fi/~jkorpela/

[Rik]

Re: hover display problem

Jukka K. Korpela <jkorpela@cs.tu t.fiwrote:

>.hover:questio n {display .answer}
>>
>Totally lost.

>
Yes, you are; you can't change the properties of another element upon
hovering an element.

I'm not sure wether it's according to standards, but FireFox & Opera have
no problem with:

div:hover + div {color:green;}


--
Rik Wasmus

[zzpat]

Re: hover display problem

Rik wrote:

Jukka K. Korpela <jkorpela@cs.tu t.fiwrote:

>>.hover:questi on {display .answer}
>>>
>>Totally lost.

>>
>Yes, you are; you can't change the properties of another element upon
>hovering an element.

>
I'm not sure wether it's according to standards, but FireFox & Opera
have no problem with:
>
div:hover + div {color:green;}
>
>
--Rik Wasmus

I found an interesting link that does some of what I want.

http://www.adjustafresh.com/tutorials/hover-markup03.html

Hover changes text.

[Rik]

Re: hover display problem

On Fri, 09 Feb 2007 22:54:09 +0100, zzpat <zzpatrick@gmai l.comwrote:

Rik wrote:

>Jukka K. Korpela <jkorpela@cs.tu t.fiwrote:

>>>.hover:quest ion {display .answer}
>>>>
>>>Totally lost.
>>>
>>Yes, you are; you can't change the properties of another element upon
>>hovering an element.

> I'm not sure wether it's according to standards, but FireFox & Opera
>have no problem with:
> div:hover + div {color:green;}

>
I found an interesting link that does some of what I want.
http://www.adjustafresh.com/tutorial...-markup03.html

Well, a perfect example about how most implementations of this nonsense
are evil. What if I wanted to copy a sentence from the content? Fat
chance, as soon as my mouse heads that direction the text is gone again.

--
Rik Wasmus

[dorayme]

Re: hover display problem

In article <eqilfp02pv8@en ews1.newsguy.co m>,
zzpat <zzpatrick@gmai l.comwrote:

>
I'm having problems understanding display and hover.
>
I'm trying to hover over a question and have the answer display.
>
.question {
color: #fff;
background: purple;

....

>
.hover:question {display .answer}
>
Totally lost.

You want understanding or you want to display an answer? Under
the bonnet of cars, mechanics do naughty things with tools, like
tap things with pliers or screwdrivers.

<http://members.optusne t.com.au/droovies/test/slack.html>

--
dorayme

[zzpat]

Re: hover display problem

Rik wrote:

>>
>I found an interesting link that does some of what I want.
>http://www.adjustafresh.com/tutorial...-markup03.html

>
Well, a perfect example about how most implementations of this nonsense
are evil. What if I wanted to copy a sentence from the content? Fat
chance, as soon as my mouse heads that direction the text is gone again.
>
--Rik Wasmus

I guess I don't see that problem in Firefox. Copying isn't a problem.
Needless to say this needs work but here's what I came up with.

div:hover p {
display: block;
font-weight: 100;
}
..question {
display: block;
width: 300px;
font-weight: bold;
padding-left: 5px;
}
..answer {
color: #000;
background: #fff;
width: 500px;
padding: 0px 20px 0px 20px;
display: none;
}

<div class="question ">This is a question
<p class="answer"> This is the answer. This is the answer. This is the
answer. This is the answer. This is the answer. This is the answer. This
is the answer. This is the answer. This is the answer. This is the
answer. This is the answer. This is the answer. This is the answer. This
is the answer. This is the answer. This is the answer.</p>
</div>

[Rik]

Re: hover display problem

On Sat, 10 Feb 2007 15:52:44 +0100, zzpat <zzpatrick@gmai l.comwrote:

Rik wrote:
>

>>>
>>I found an interesting link that does some of what I want.
>>http://www.adjustafresh.com/tutorial...-markup03.html

> Well, a perfect example about how most implementations of this
>nonsense are evil. What if I wanted to copy a sentence from the
>content? Fat chance, as soon as my mouse heads that direction the text
>is gone again.
> --Rik Wasmus

>
I guess I don't see that problem in Firefox.

I see the problem in Opera, and in a lesser extent in MSIE & FireFox: one
has to _keep_ hovering either the tab or the text to let it remain
visible. That means if I move my mouse from a tab, in Firefox & MSIE I can
only do that downwards towards the text. Hovering and then mousing to the
left, roght or top will put the deafult tab2 back.

In Opera it's even worse, because there's a gap between the tab and the
content. On crossing this gap, the page will return to the default, so the
only way I can see that content is to keep my mouse hovered above the tab.
--
Rik Wasmus

[zzpat]

Re: hover display problem

Rik wrote:
uess I don't see that problem in Firefox.

>
I see the problem in Opera, and in a lesser extent in MSIE & FireFox:
one has to _keep_ hovering either the tab or the text to let it remain
visible. That means if I move my mouse from a tab, in Firefox & MSIE I
can only do that downwards towards the text. Hovering and then mousing
to the left, roght or top will put the deafult tab2 back.
>
In Opera it's even worse, because there's a gap between the tab and the
content. On crossing this gap, the page will return to the default, so
the only way I can see that content is to keep my mouse hovered above
the tab.
--Rik Wasmus

I'm of the opinion that clicking a mouse will end. Maybe someday css
will allow us to do a mouse clicks without clicking (something like
hover:click).

A FAQ like this usually requires a script and a click. I was trying to
do it without both - mostly without the click. To that end it did what
I wanted it to do.

[Rik]

Re: hover display problem

On Mon, 12 Feb 2007 18:42:11 +0100, zzpat <zzpatrick@gmai l.comwrote:

Rik wrote:
uess I don't see that problem in Firefox.

> I see the problem in Opera, and in a lesser extent in MSIE & FireFox:
>one has to _keep_ hovering either the tab or the text to let it remain
>visible. That means if I move my mouse from a tab, in Firefox & MSIE I
>can only do that downwards towards the text. Hovering and then mousing
>to the left, roght or top will put the deafult tab2 back.
> In Opera it's even worse, because there's a gap between the tab and
>the content. On crossing this gap, the page will return to the default,
>so the only way I can see that content is to keep my mouse hovered
>above the tab.
>--Rik Wasmus

>
I'm of the opinion that clicking a mouse will end. Maybe someday css
will allow us to do a mouse clicks without clicking (something like
hover:click).
>
A FAQ like this usually requires a script and a click. I was trying to
do it without both - mostly without the click. To that end it did what
I wanted it to do.

IMHO I should be able to use all main functionality of a page using only a
keyboard (graphical effects I can do without). If that's not possible,
it's very, very likely some people won't be able to use the site at all.
--
Rik Wasmus