Как скрыть всплывающую подсказку на смартфонах с сенсорным экраном?
Я новичок в JavaScript. Я использовал поиск, чтобы найти решение для моей проблемы, но я не мог найти то, что искал.
Я использую этот jquery.balloon.js, который преобразует отображение всплывающей подсказки в браузере по умолчанию в настраиваемую (с добавлением некоторого CSS-кода - фона, рамки и т. Д.).
Это код JavaScript:
$(document).ready(function(){
$('a').balloon({
position: "bottom",
tipSize: "0"
});
});
Все работает просто отлично: при наведении мыши на ссылку с включенным title атрибут, всплывающая подсказка отображается настроенным. Когда я наведите курсор мыши, подсказка скрывается.
Проблема возникает при просмотре на устройствах с сенсорным экраном.
Нет мыши для наведения, поэтому я нажимаю один раз на ссылку, и всплывающая подсказка появляется (ссылка не активируется, ссылка активируется только при двойном нажатии), но подсказка не скрывается. Я нажимаю где-нибудь на теле, но подсказка остается на экране.
Я знаю, как скрыть элементы в JavaScript, нажав / нажав на них (в html или же body) с $('html').click(function() { //code });, но здесь проблема в том, что всплывающая подсказка не элемент, а атрибут...
Как скрыть только всплывающую подсказку где-то в теле?
Вы можете проверить это поведение на сайте jquery.balloon.js здесь с любым устройством с сенсорным экраном, чтобы увидеть, что однажды активированная нажатием всплывающей подсказки не может скрыться.
2 ответа
Спасибо за единственный ответ, но я понял это.
Я создал class со следующим кодом:
$.balloon.defaults.classname = ".balloon";
$.balloon.defaults.css = null;
Таким образом, я создал .balloon класс, который позволил мне настроить подсказку самостоятельно. Я использовал этот код, чтобы скрыть подсказку, скрывая .balloon (которая скрывает недавно настроенную подсказку jQuery):
$(document).ready( function(){
$('body').click( function(event){
event.stopPropagation();
$('.balloon').hide();
});
});