移動觸摸顯示和隱藏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

回答

相關問題