JQuery tooltip не закрывается в iphone 6

Question

при использовании всплывающей подсказки jQuery на веб-сайте правильно работает на всех браузерах. Но в мобильном специально iphone 6 он не работает proprly.when нажмите на него всплывающая подсказка открыта, но она не закрыта event.but нажмите другую подсказку. предыдущий закрыт. Пожалуйста, помогите мне исправить эту проблему.

this is the issue but not fixed

Answer 1

при подсказке нажмите установить над слоем между подсказкой и body.after над слоем мышами близко как подсказкой и более layer.finally это работа для меня

jQuery("#amount").tooltip(); 
 
jQuery('#amount').bind('touchstart' ,function(){ 
 
\t jQuery("#amount").tooltip('open'); 
 
    jQuery('#overlay').css('display', 'block'); 
 
}); 
 

 
jQuery('#overlay').bind('touchstart' ,function(){ 
 
    jQuery('#overlay').css('display', 'none'); 
 
    jQuery("#amount").tooltip('close'); 
 
});

\t \t #overlay{ 
 
    display:none; 
 
\t position:absolute; 
 
\t top:0; 
 
\t left:0; 
 
\t width:100%; 
 
\t height:100%; 
 
\t z-index:1000; 
 
\t background-color:#333; 
 
\t opacity:.80; 
 
} 
 

 
#popup{ 
 
    color: #333; 
 
\t display: none; 
 
\t position: absolute; 
 
\t top: 40%; 
 
\t left: 40%; 
 
\t width:200px; 
 
    height: 200px; 
 
\t padding: 1em; 
 
\t border: 5px solid #333; 
 
\t background-color: white; 
 
\t text-align: left; 
 
\t z-index:1001; 
 
\t overflow: auto; 
 
\t font-size:16px; 
 
}

<link href="https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.10.1/css/smoothness/jquery-ui.css" rel="stylesheet"/> 
 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script> 
 
<script src="https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.10.1/jquery-ui.js"></script> 
 
<input type="button" id="btn" value="Click Here" /> 
 
    <div id="overlay"></div> 
 
    <input id="amount" title="Please add.">