jQuery Mobile swipe не работает

Я работаю над созданием собственной галереи изображений для проекта. Для этого мне нужно провести событие салфетки. Так нашел ниже код на jsfiddle. Вставьте все необходимые файлы. Он показывает список и все. Но все же салфетка не работает.? Я пишу код jquery в нужном месте? Или что-то не так? Здесь `s мой код:jQuery Mobile swipe не работает

<html> 
     <head> 
     <meta charset="utf-8" /> 
     <title>Home</title> 
     <!-- Meta viewport tag is to adjust to all Mobile screen Resolutions--> 
     <meta name="viewport" 
      content="width=device-width, initial-scale=1, maximum-scale=1" /> 

     <link rel="stylesheet" type="text/css" href="Css/style.css" /> 
     <link rel="stylesheet" type="text/css" href="Css/Jstyle.css" /> 
     <link rel="stylesheet" type="text/css" href="Css/jquery.mobile.theme-1.2.0.css" /> 
     <link rel="stylesheet" type="text/css" href="http://code.jquery.com/mobile/1.0b2/jquery.mobile-1.0b2.min.css" /> 

     <script type="text/javascript" src="Javascript/jquery1.js"></script> 
     <script type="text/javascript" src="Javascript/jquery2.js"></script> 
     <script type="text/javascript" src="css/jq1.6.2.js"></script> 

     <script type="text/javascript"> 
     $("#listitem").swiperight(function() { 
      $.mobile.changePage("#page1"); 
     }); 
     </script> 

     </head> 
     <body> 

      <div data-role="page" id="home"> 
      <div data-role="content"> 

        <ul data-role="listview" data-inset="true"> 
         <li id="listitem"> Swipe Right to view Page 1</a></li> 
        </ul> 

      </div> 
     </div> 

     <div data-role="page" id="page1"> 
      <div data-role="content"> 

       <ul data-role="listview" data-inset="true" data-theme="c"> 
        <li id="listitem">Navigation</li> 

       </ul> 

       <p> 
        Page 1 
       </p> 
      </div> 
     </div> 

     </body>

источник

2013-02-18 Ashwin

Какая скрипка? Вы действительно добавляли файлы на свой сервер? Любые ошибки в консоли, если вы смотрите на обычный компьютер – mplungjan

Этот код даже не работает для меня, даже если я применяю принятое решение – Black

Попробуйте с pageinit обработчике JQuery мобильный:

$(document).on('pageinit', function(event){ 
    $("#listitem").swiperight(function() { 
     $.mobile.changePage("#page1"); 
    }); 
});

Docs for pageinit @ Jquery мобильного телефона.

Из документов:

Take a look at Configuring Defaults

Поскольку JQuery-мобиля событие срабатывает сразу, вам нужно связать обработчик событий перед загрузкой JQuery Mobile. Ссылка на ваши файлы JavaScript в следующем порядке:
<script src="jquery.js"></script> 
<script src="custom-scripting.js"></script> 
<script src="jquery-mobile.js"></script> 

источник

2013-02-18 09:39:30 Jai

Спасибо jai .. Это работает :) – Ashwin

Мне не нравится тот факт, что вы запутываете страницу с помощью mobileinit. Даже если вы лично не путаете эти два вопроса, ваш ответ о странице, а затем вы цитируете что-то о mobileinit. Сдвиньте от меня. – TigOldBitties

сэр, вы только что спасли мне чашу головной боли –

-2

Это сводит меня с орехами too..I не должны использовать .он («pageinit»), как предложено в предыдущем посте. Оказывается, мой синтаксис верен в моем JQuery, но CASE SENSITIVTY была моей проблемой. «swiperight» не работал, но «swipeRight» сделал! Приведенный ниже код работал для меня, а также исправил проблему Swipe, предотвращающую прокрутку документа вверх и вниз в мобильных браузерах. Обязательно укажите методы swipeRight и swipeLeft отдельно, а не один общий класс «swipe», и вам хорошо идти! * Обратите внимание на строку Exclude Elements внизу, заметив, что я выбрал «span» из списка, чтобы разрешить прокрутку на обычно используемом элементе span.

$(function() { 

     $('.yourclassname').swipe( 
     { 
     swipeLeft:function(event, direction, distance, duration, fingerCount) 
     { 
      // do your swipe left actions in here, animations, fading, etc.. 
      alert(direction); 
     }, 
     swipeRight:function(event, direction, distance, duration, fingerCount) 
     { 
      // do your swipe right actions in here, animations, fading, etc.. 
      alert(direction); 
     }, 
     threshold:4, 
     // set your swipe threshold above 

     excludedElements:"button, input, select, textarea" 
     // notice span isn't in the above list 
     }); 
});

источник

2015-06-17 02:58:14 Victor

Вопрос был о 'jQuery mobile', а не' touchSwipe library' -1 – 2016-03-10 18:11:12

jQuery Mobile swipe не работает

ответ

Смежные вопросы