0

For some reason this doesn't always work in safari and functions even less on the iPad, any guesses? =(

$(".dropdown .sub").click(function () {
     $("#menu .holder").toggle();
});
markp
  • 13
  • 1
  • 2
  • 2
    Without the context of your HTML or other javascript it's impossible to say. However, what you've got in your question should work without any issues. – Rory McCrossan Aug 15 '13 at 15:16
  • @markp see http://jsfiddle.net/rCN9n/1/ - that's some very basic markup and your jQuery. The jQuery is fine, so it's impossible to tell what's causing your issues without knowing more info. – Ian Clark Aug 15 '13 at 15:18
  • I'm very sorry, I didn't know context might be the issue, [here is a link to the site](http://www.ielectronics.com). – markp Aug 15 '13 at 15:23
  • @markp a link to the site isn't enough, you need to add code that would recreate the issue in your question so that you question will be useful after your problem is solved. – Kevin B Aug 15 '13 at 15:36

1 Answers1

1

After looking at the web page provided It appears that the toggle selector has many children. Something like this:

<div id="menu" class="dropdown">
    <ul>
        <li class="level1">
            <a class="sub" href="#"><strong>TV &amp; Video</strong></a>
            <div class="holder">HOLDER</div>
        </li>
        <li class="level1">
            <a class="sub" href="#"><strong>TV &amp; Video</strong></a>
            <div class="holder">HOLDER</div>
        </li>
    </ul>
</div>

This will not work:

$(".dropdown .sub").click(function () {
     $("#menu .holder").toggle();
});

You will need to find the first sibling element.

$(".dropdown .sub").click(function () {
     $(this).siblings(".holder").eq(0).toggle();
});

Find a jsfiddle of this here ->http://jsfiddle.net/rCN9n/5/

Rod Hartzell
  • 420
  • 3
  • 9
  • I'm very sorry, I didn't know context might be the issue, [here is a link to the site](http://www.ielectronics.com). – markp Aug 15 '13 at 15:24
  • Unfortunately the dropdown stops working when I change .click to .change =( – markp Aug 15 '13 at 15:58
  • I updated the fiddle above to use your markup. click method still works. [http://jsfiddle.net/rCN9n/2/](http://jsfiddle.net/rCN9n/2/) – Rod Hartzell Aug 15 '13 at 16:08
  • I think I see the problem. You have many many elements that match $('#menu .holder') You will need to make the holders unique or use a jquery ":first-child" selector. – Rod Hartzell Aug 15 '13 at 16:12
  • Okay. I got it! Here is the magic jquery sauce: `$(".dropdown .sub").click(function () { $(this).siblings(".holder").eq(0).toggle(); });` I updated the above jsfiddle [http://jsfiddle.net/rCN9n/5/](http://jsfiddle.net/rCN9n/5/) – Rod Hartzell Aug 15 '13 at 16:22
  • Thank you so much Rod, you truly are awesome! I'm too new with jQuery to have ever figured that out! =) – markp Aug 15 '13 at 17:49