Results 1 to 6 of 6

Thread: Accordion Menu script (v1.3) action onrollover rather than click?

  1. #1
    Join Date
    May 2008
    Posts
    4
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default Accordion Menu script (v1.3) action onrollover rather than click?

    1) Script Title: Accordion Menu script (v1.3)

    2) Script URL (on DD): http://www.dynamicdrive.com/dynamici...daccordion.htm

    3) Describe problem: Hello, I've been fiddling with this script and what a lot of fun it is. Thank you for posting the script on DD

    A sample of my manipulation is here:
    http://www.connectec.com/design_stun..._accordion.htm

    The part I have a question about is this: If you look at the bar that says "cats," you can see there are two additional links over at the right edge. When I click on those, I just want them to be regular links that take me to a new page, instead of collapsing the cat on the sidewalk picture as they do now. Any idea how I could accomplish this?

    here is the code that makes the cat bar and image:
    <div class="mypets"><a href="#" onmouseover="ddaccordion.expandone('mypets', 1); return false">Cats</a>
    <ul><li><a href="hunters.htm" onClick="return(this)">hunters</a></li><li><a href="history.htm">history</a></li></ul>
    </div>

    <div class="thepet"><img src="images/sidewalk_cat.jpg" alt="sidewalk cat" width="422" height="67" />
    <p span class="paleOnTop">Cats are often valued <BR />
    for their <a href="companionship.htm">companionship</a> <BR />
    and ability to hunt.<BR /></p>
    </div>


    I am attempting to achieve the same effect that is used at http://www.brown.edu/ But I am pretty sure they are not using this script to do it.

    Thanks,
    Carolyn

  2. #2
    Join Date
    May 2008
    Posts
    4
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default clarification

    the onmouseover part of things is working fine. The menus expand and collapse on rollover as desired. I have the variables set so that only one div can be open at a time.

    The default for this script is for the action to happen on click, and I want to be able to click on a hyperlink on the currently expanded menu bar and browse to that link. I never need any div to collapse 'onClick.'
    Thanks.

  3. #3
    Join Date
    Aug 2004
    Posts
    10,143
    Thanks
    3
    Thanked 1,008 Times in 993 Posts
    Blog Entries
    16

    Default

    Firstly, if you're looking to get the headers to expand onMouseover, you don't need to physically include the codes:

    Code:
    onMouseover="ddaccordion.expandone('mypets', 0); return false"
    inside your HTML. A modified version of ddaccordion.js does this.

    Regarding disabling the headers from collapsing onClick, find the line:

    Code:
    $('.'+config["headerclass"]).click(function(){ //assign behavior when headers are clicked on
    and change that to:

    Code:
    $('#nosuchid').click(function(){ //assign behavior when headers are clicked on
    Either in the original ddaccordion.js, or the modified one I mentioned earlier.

  4. #4
    Join Date
    May 2008
    Posts
    4
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default Yes, that's the trick!

    Thank you for your quick reply and accurate resolution.

    I still have some tweaking before I put the pages on the public part of the site, but this is 90% there...

    Kudos!
    C.

  5. #5
    Join Date
    May 2008
    Posts
    4
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default and now, a little delay on the mouseover?

    Hello,
    Here is a sample of what I am working on.
    http://www.connectec.com/accordion_sample20080721.htm

    I love this script, and have made the modifications you suggest so that it works onmouseover. Is there anyway to delay the opening of the sub menus? Onmouseover makes me a little seasick if I accidently roll my mouse over several menus in succession. I want something that works a little more like "hover,"
    So the menu doesn't drop if you just rollover it briefly, but only opens if you pause the mouse on that menu heading.

    Thanks.

  6. #6
    Join Date
    Aug 2004
    Posts
    10,143
    Thanks
    3
    Thanked 1,008 Times in 993 Posts
    Blog Entries
    16

    Default

    This is based on the newer 1.5.1 version of ddaccordion.js. To add a delay, try replacing the line:

    Code:
    ddaccordion.expandone(config["headerclass"], parseInt($(this).attr("headerindex")))
    with:

    Code:
    var headerobj=this
    setTimeout(function(){ddaccordion.expandone(config["headerclass"], parseInt($(headerobj).attr("headerindex")))}, 500)
    where 500 is the delay in milliseconds.

Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •