Link to home
Start Free TrialLog in
Avatar of andycwk
andycwk

asked on

Pure css contextual help

Pure css contextual help

Hi all,

I have received a development specification that requires contextual help for each filed in a submission form.

I have performed several searches through google for a pure css solution without any luck (I have found solutions that include both css and javascript).

Before I implement a solution that uses javascript, do any CSS experts have any ideas for a pure css context help solution?

Thanks in advance... Andy

Avatar of huji
huji
Flag of United States of America image

Andy,
What do you exactly mean by context help? Give an example please.
Thanks
Huji
ASKER CERTIFIED SOLUTION
Avatar of smaccari
smaccari

Link to home
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
Start Free Trial
SOLUTION
Link to home
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
Start Free Trial
Avatar of andycwk
andycwk

ASKER

huji,
I have a div that appears on the page that has some help for the form section, at the bottom of this div is a further div/span that the contents of which will change depending on the active input field.
I was wondering if maybe a activeField:hover could effect the display settings of a different element.

smaccari, noamattd,
I had a feeling that CSS would not perform the actions that I desired, but I needed to know for sure before dismissing it.

I will wait to see if huji has anything further to say before I close the question and assign points.

Andy


You can not change an element style with a CSS rule applied to another one.
The activeElement:hover rule will affect only the element being mouse overed.

The only way to do what you need is through JavaScript, with a mouseover event handler.
andycwk,

If you want a div's content to be contextual depending on what field is active, you'll need to use javascript and the onfocus/onblur event handlers for each field.  Again, you can minimize the effort by having javascript just inject the content and letting your CSS take care of styling it.  If you feel like you'll be doing a lot of stuff like this and need to learn javascript I'd recommend picking up The Definitive Guide to Javascript : http://www.amazon.com/gp/product/1565923928/002-2537117-8544806?v=glance&n=283155

It's what I use and it's been a very useful book to learn from/use as a reference.
Avatar of andycwk

ASKER

Hi noamattd,

Thanks for your concern regarding my javascript capabilities... I already have sufficient skills to use javascript for the implementation ;)
Then use them, my friend!  Use them well!
Avatar of andycwk

ASKER

hmm... Do I sence some hostility... never mind :P thanks for the help :)
>> huji, I have a div that appears on the....
I was away when all the discussion happened. I agree with the other people. With CSS (at least the version supported by current browsers) you can not affect other DIVs when an object is moused over (or mouse overed! I'm not sure which one is correct!) You need to use your javascript skills for that, and I reckon it is very easy for you to do that. However, we are here to help you, in case.
Huji