Hello!
I'm trying to create a list menu. When the user clicks on the list header the other elements should appear. My function looks like this:
<script type="text/javascript"> Event.observe('female_header', 'click', function() { toggle_div('female_categories'); });
function toggle_div(element) { Effect.toggle(element, 'blind'); return false; } </script>
My list menu looks like this:
<ul> <li class="header" id="female_header" ><%= link_to "Dam", :action => category=('female') %></li><br /> </ul> <div style="display: none" id="female_categories"> <ul> <li class="li_content"><%= link_to "Accessoarer", :action => category=('female_accessories') %></li><br /> etc... </ul> </div>
The function starts but when the page has loaded it stops.
The function works when I try this:
Event.observe(window, 'load', function() { toggle_div('female_categories'); });
So I think the problem is in my Event.observe.
Any tips would be greatly appreciated!
// Anders