Click and Toggle with jquery, 1-click delay

0

I have a little problem that I do not know how to solve, I have a div, which when clicking on it it adds something with load (), and it alternates this event with toggle (), to add and remove too, only when I give the first click it does not immediately display, only when I click a second time, then it will normally execute the click event, follow the code:

$('.more .ico').click(function(){
    $('.more .toggle').toggle( 50, function(){
        $(this).load("frames/menu-drop.php");
    });
});
<div class="more">
    <div class="ico"></div>
    <div class="toggle"></div>
</div>

When I clicked on ico, I was going to apply load () to .toggle

I understand why this happens, but I do not know a way to solve it, and if someone suggests using on ('click') I already tried it.

    
asked by anonymous 06.08.2018 / 22:14

1 answer

0

The problem that the toggle is "hiding" your div in the first click because it is visible. Using toggle can cause an unwanted state. Try using the show () or fadeIn () instead of toggle . It does not make sense to call the load when you're hiding the div . To start the hidden div , set the visible: hidden attribute in the .toggle css class attribute to the style attribute

    
07.08.2018 / 16:25