移动触摸显示和隐藏div

我正在尝试创建一个脚本，我可以触摸图像以显示div并在可见时再触摸并再次隐藏。当我触摸它显示和隐藏在同一时间。我知道为什么，但是我只是不知道如何让它继续显示，只要我触摸一次，然后一旦再次触摸它就会隐藏。我所遇到的问题很明显，它使得它有两个功能来显示和隐藏序列。这是我的尝试：移动触摸显示和隐藏div

HTML

<div id="box1"> 
<div class="boxesBubble bubble1"> 
<a href="http://iarabrows.pt/novo2/threading">Threading &#8690;</a><br> 
<a href="http://iarabrows.pt/novo2/threading">Sobrancelhas &#8690;</a><br> 
<a href="http://iarabrows.pt/novo2/threading">Pestanas &#8690;</a><br> 
<a href="http://iarabrows.pt/novo2/threading">Limpeza de pele &#8690;</a><br> 
<a href="http://iarabrows.pt/novo2/threading">Peeling &#8690;</a><br> 
</div> 
<div id="boxes" class="img1"> 
<img class="imageBoxes" src="images/face.jpg"/> 
<div class="arrow_box"> 
<div id="boxTitle"> 
Face 
</div> 
</div> 
</div> 
</div>

脚本

$('.img1').on('mouseover touch', function() { 

    $('.bubble1').show(200); 

}); 
$('#box1').on('mouseleave click touch', function() { 

    if($('.bubble1').is(':visible')){ 
    $('.bubble1').hide(200); 
    } 

});

也尝试过这种方法，但显示和隐藏的一瞬间

$('#box1').on('touch', function() { 
    if($('.bubble1').is(':visible') == true){ 

     $('.bubble1').hide(200); 

    } else { 

     $('.bubble1').show(200); 

    } 
});

来源

2016-11-12 Jose Borges

你试过toggle？

$('.bubble1').toggle(200);

来源

2016-11-12 18:59:46 Johannes

好想，但只是试过，并没有工作。 –

a。）您是否包含jQuery mobile？ b。）如果是，但它仍然无法正常工作，请尝试用“tap”而不是“touch” – Johannes

触摸正常工作，我遇到的问题是如何制作一个jQuery，当我触摸时保持可见状态，然后再次触摸并它隐藏起来。我也尝试过变量，它保持显示，但不会隐藏。我所遇到的问题很明显，它使得它有两个功能来显示和隐藏序列。 –

移动触摸显示和隐藏div

回答

相关问题