Hi,

I just programmed a simple show/hide feature: You click on a link and
extra information is displayed. Click again and it is hidden.

The link has a href like "#moreInfoContent". When I add an
onclick="return false;" I have the desired result that the href is not
displayed in the addressbar. When I try to add this return false in my
javascript (unobstrusive) it doesn't work for me. The link is
displayed in the adress bar so the browser jumps to that position.

Here my html code:

<a href="#moreInfoContent" id="moreInfo" class="title">Show me more</
a>
<div id="moreInfoContent" class="moreInformation">More Information</
div>

This is the javascript:

function openMoreInfo(event) {
        if (Element.hasClassName(this, 'more')) {
                new Effect.BlindUp(this.identify() + 'Content', { duration: 0.2 
});
                Element.removeClassName(this, 'more');
        }
        else {
                new Effect.BlindDown(this.identify() + 'Content', { duration:
0.2 });
                Element.addClassName(this, 'more');
        }
        return false; // if I add this directly to the link onclick="return
false;" it works!
}

// when the dom is fully loaded, execute these scripts
document.observe("dom:loaded", function() {
        // init more information handling
        $$('.moreInformation').invoke('hide');
        $$('.title').invoke('observe', 'click', openMoreInfo);
});
--~--~---------~--~----~------------~-------~--~----~
You received this message because you are subscribed to the Google Groups 
"Prototype & script.aculo.us" group.
To post to this group, send email to prototype-scriptaculous@googlegroups.com
To unsubscribe from this group, send email to [EMAIL PROTECTED]
For more options, visit this group at 
http://groups.google.com/group/prototype-scriptaculous?hl=en
-~----------~----~----~----~------~----~------~--~---

Reply via email to