JQuery показать / скрыть переключает стрельбу только на больших экранах

Question

URL-адрес http://zacimoveis.vistatemporario.com.br/nossa-equipe

Проблема связана с синим окном описания, которое отображается при наведении курсора на изображения. Он отлично работает для экранов размером более 980 пикселей, но ничего не происходит на экранах <980 пикселей, будь то планшеты / мобильные телефоны или настольные компьютеры. </p>

Я пробовал toggle (), slideToggle () и прямо вверх show () и hide () и искал множество различных вариантов.

Вот текущая версия скрипта:

$(document).ready(function() { $(".membro").hover(function() {
var pessoa = $(this).attr('id');
$('#txt' + pessoa).toggle()
})});

(в консоли не отображается сообщение об ошибке.)

Answer 1

Думаю, что проблема здесь в том, что вы используете .hover. Не думайте, что это сработает на ваших столах / телефонах и т. Д. На самом деле, как я помню, на планшетах / мобильных телефонах нет.

Возможно, вам придется что-то сделать в духе

$(".membro").on("hover touchstart",function(evt){
   // whatever
})

ИЛИ вам может понадобиться добавить немного больше классов CSS. Похоже, что в подходе начальной загрузки используется сеточная система, которая также может повлиять на ваше позиционирование.