add url in jquery accordion

Question

I'm having trouble with jquery accordion menu. I want ONLY the text "Chewable Oraldolphilus" go to a url. The requirement is that it should work with click not mouseover. Right now when you click anywhere next to a link it goes to a url instead of just expanding the accordion. Please advise. Thanks.

http://www.maxihealth.com/test/accordion3.html

Answer 1

This is what you defined: the anchor tag goes to yahoo.com - and the only thing you can click is the anchor tag. So you just need to add a div tag. For example:

<li>
    <div class="head"> <!-- this is the block which you click to open the div beneath -->
        <a href="http://yahoo.com"&gt;Yahoo&lt;/a&gt; <!-- this link leads you to your URL (yahoo.com) -->
    </div>
    <div> <!-- this is the hidden container -->
        Content goes here.
    </div>
</li>

PS: try to use external JS - to Link something via javascript/jquery you can define a class and in your (external) jquery-file you add the following:

$('.class').click(function(){
    location.href = 'http://yahoo.com';
});

Answer 2

I didn't look at the source code, but the following should work:

$(".head > div:first-child").click("function(){
 $(this).next().slideToggle(500);
  return false // this prevents the default behavior (changing the location of the page)  
}")