PDA

View Full Version : DHTML Help


Methulah
03-10-2006, 04:27 PM
Hey,
I'm building a website for an unnancounced project (doesn't mean I'm giving up on other projects, jsut something on the side), and I realise that my PHP/MySQL knowledge is almost useless for the site I want to program.

I need to learn to use Javascript to get a div element from my CSS block and change its visibility property. When doing this, it also has to change every other div's visibility to hidden. I got some of this code off a tutorial and I was wondering what I needed to do.

function showDiv(act1) {
myReference = getRefToDiv(act1);
if( !myReference ) {
window.alert('Nothing works in this browser');
return; //don't go any further
}
if( myReference.style ) {
myReference.style.visibility = 'visible';
} else {
myReference.visibility = 'show';
}
}

The div I want to change the visibility of is called "(#)act1", and it is all set up well and defaults to hidden visibility on page load. My link is
<a href="#" onclick="showDiv('act1');">Link Text</a>.

However, this doesn't show the act1. I was wondering if anyone who actually knows Javascript and DHTML might have an idea of what to do.

Thanks.

geon
03-10-2006, 05:16 PM
I usually just set visibility to '' (zero length string) when I want to show it.

Methulah
03-10-2006, 08:17 PM
Changed it to that and it still doesn't work.

Reedbeta
03-11-2006, 02:13 AM
According to the CSS standard, the values for the visibility property are 'hidden' and 'visible'. Setting it to a blank string will revert to whatever the stylesheet says for that element. I would access it by using document.getElementById('act1').style.visibility - this should work in at least IE and Firefox, not sure about other browsers.

You can also look at this page (http://www.quirksmode.org/index.html?/js/blockinvi.html), which describes the difference between the visibility and display properties as well as showing a (presumably) working example of how to use them.

One final note, it's better to write <a href="javascript:myFunc('blah')"> instead of <a href="#" onclick="myFunc('blah')">. The reason is that setting the link target to '#' often causes the browser to return to the top of the page in addition to executing a function.

Methulah
03-11-2006, 02:22 PM
Thanks. I haven't yet tried that out, but I will when I get home. Thanks again. The reason why I was enquiring is because all donwloadable scripts that I've seen on the net are huge and seem to do way too much for what they should do.

Anyway, thanks again and I'll try to get that working.