PDA

View Full Version : Accordion with customised hover function



mickkmg
12-04-2011, 02:31 PM
hi there

i'm trying to make a sub menu accordion, with custom hover on the header

have a look at the test page here:

http://www.ariprasetya.com/index.php?/projects/test/

and here's the code i have


<head>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>


<script type='text/javascript' src='http://www.ariprasetya.com/ndxz-studio/site/js/apjs.js'></script>
</script>

</head>

<script type=text/javascript>

function changetext()
{
var textchange2 = "? Work" ;
var id = document.getElementById("DP");
id.innerHTML=textchange2;
}

</script>

<span id="slidemenu">
<div id="selected" class="col">
<ul id="project_list">
<li>
<h3><a class="msg_head_2" href="#" onmouseover="innerHTML='&rarr; Work'" onmouseout="innerHTML = 'Work'" onclick="innerHTML='&darr' Work'">Work</a>
<div id="msg_body_2">
<li><h3 ><a href='#'>House - Olinda</a></h3></li>
<li><h3><a href='#'>Cafe - Hawk&Hunter</a></h3></li>
<li><h3><a href='#'>Studio - ThursdaySunday</a></h3></li>
</div>
</h3></li>
</br>
<li>
<h3><a href='http://www.ariprasetya.com/' onmouseover="innerHTML = '? News'" onmouseout="innerHTML = 'News'" >News</a></h3>

</li>

</br>
<li>
<h3><a href='http://www.ariprasetya.com/' onmouseover="innerHTML = '? Information'" onmouseout="innerHTML = 'Information'">Information</a></h3>

</li>

</ul>
</div>
</span>

I'm trying to get the arrow from not showing, to show when mouseover (basic mouseover and mouse out), AND arrow down when WORK is clicked and showing submenus, and stays down until: header is clicked or user clicks somewhere else, then menu will fold up. and I'm stumped at the moment :(

at this stage I'm hoping that it will be the only drop down menu that expands when clicked, as the other two would just link to another page.

also another issue i have is that the navigation is bubbling around when hover is activated :/ any help on this would be greatly appreciated

thanks very much guys!