Изменить атрибут iframe "src", если jQuery не работает на мобильном

Question

В моем hrml-макете у меня есть iframe для отображения различного содержимого при нажатии на разные миниатюры. Например, при нажатии на thumb1, iframe будет отображать содержимое page1.html; при нажатии на thumb2 iframe будет отображать содержимое page2.html. Встроенный атрибут src iframe установлен на page3.html в качестве отображения по умолчанию:

<iframe id="frame" src="page3.html" frameborder="0" scrolling="no">       </iframe>

И src будет изменен при клике по событию jQuery:

$('.thumb1').click(function(){
 $('iframe').attr('src', "page1.html");
});

$('.thumb2').click(function(){
 $('iframe').attr('src', "page2.html");
});

$('.thumb3').click(function(){
 $('iframe').attr('src', "page3.html");
});

$('.thumb4').click(function(){
 $('iframe').attr('src', "page4.html");
});

 $('.thumb5').click(function(){
$('iframe').attr('src', "page5.html");

}); 

С Chrome это работает на настольном ПК. Однако на мобильных устройствах iframe src не изменяется, но остается "page3.html", содержимое не изменяется соответствующим образом при нажатии с различными миниатюрами. Помощь и предложения очень ценятся!

Answer 1

Я использовал TouchSwipe jQuery Plughin, поэтому "щелчок" даже конфликтует с "проведением". <a> теги добавляются, чтобы обернуть вокруг миниатюры, и событие клика срабатывает.