Previous Message
Next Message

Best Way to Show/Hide Text

Sent by Jon Wynacht on 14 March 2006 17:05


Sorry...I was too specific about everything and too general about  
what kind of feedback I was looking for ;-(

See my replies inline.



On Mar 14, 2006, at 9:16 AM, Els wrote:

> Jon Wynacht wrote:
>> I'm wondering if there is a definitive way to show/hide text
>> using JavaScript and CSS. I'm working on a project which
>> involves a map with various states that are linked. When a
>> state is clicked content appears which is relevant to that
>> state. Click another state, the old content is hidden and the
>> new content appears.
>> You can see what I've come up with here:
>> Obviously this doesn't work so well as the positioning is not
>> correct.
> How do you mean 'not correct' ? Is it in the wrong place? where do  
> you want it to appear?

It should be centered with the map, the white boxes matching on left  
and right edges. I can get this to happen on Safari but not with IE  
and FF for Windows.

>> I'm using the same CSS for each <div/> of content:
>> #ca
>> {
>> background-color: #FFFFFF;
>> width: 480px;
>> position: absolute;
>> top: 515px;
>> left: 378px;
>> visibility: hidden;
>> z-index: 100;
>> padding: 10px;
>> }
>> I'm then using JavaScript to show/hide the layers.
>> Any suggestions to obtain cross-browser positioning bliss?
> It's currently showing the same in Windows IE, Opera and FF here.

Yup. I'd like to have it appear the same for all (most!) popular  
browsers. Looking for hints or tips

> Another suggestion though: let the text 'click on a state...' only  
> appear if JS is enabled. That way nobody needs to try and click  
> while nothing happens :-)

Yup. I will definitely degrade that functionality. Thanks!
css-discuss [EMAIL-REMOVED]]
IE7b2 testing hub --
List wiki/FAQ --
Supported by --
Previous Message
Next Message

Message thread: