Touch Events sur SVG avec JQuery mobile

Je travaille sur une application web qui contient SVG dans chaque page, afin de tourner une page, je dois utiliser glisser (gauche et droite). Swipe événements sont détectés sans aucun problème sur une div ou img, etc. Mais il est impossible de détecter événement touche le fichier SVG inclus :(Touch Events sur SVG avec JQuery mobile

J'utilise JQuery 1.6.4 et JQuery 1.0b3 mobile.

JS:

$('.touchPad object').live('swipeleft swiperight',function(event){ 
    var currentPage = getVar("page"); 
    if(currentPage == "0") 
    { 
     currentPage = 1; 
    } 

    if (event.type == "swiperight") { 
     currentPage ++; 
     var page = "page="+currentPage; 

     $.mobile.changePage({ 
     url: "http://asample.com/JQueryMobileTests/index.php", 
     type: "get", 
     data: page}, 
     "slide", 
     true 
     ); 
    } 
    if (event.type == "swipeleft") { 
     currentPage --; 
     var page = "page="+currentPage; 

     $.mobile.changePage({ 
      url: "http://asample.com/JQueryMobileTests/index.php", 
      type: "get", 
      data: page 
     }); 
    } 
    event.preventDefault(); 
});

HTML.

<div role-data="page" class="touchPad"> 
    <div role-data="header"></div> 
    <div role-data="content"> 
     <div> 
      <h1>Page : </h1> 
      <object type="image/svg+xml" data="pict.SVG" width="800" height="800"></object> 
     </div> 
    </div> 
</div>

Source

2011-09-23 juju_b55

Je viens de poster une question similaire http://stackoverflow.com/questions/22415992/how-is-jquery-mobile-interfering-with-my-mouse-touch-listening-on-svg-documents. La recherche dans le code mobile de jquery dans Chrome DevTools montre certains endroits où il bloque la propagation des événements souris, mais je ne suis pas sûr de ce qui peut être spécifique à SVG, si tant est que ce soit. –

J'ai exactement le même problème en essayant d'obtenir swipe Events sur svg qui contient l'animation sur un clic la seule façon que j'ai trouvé t o obtenir l'événement swipe est de mettre un div superposant le svg avec l'opacité à 0 mais je perds l'événement click sur SVG alors.

<svg style="width:100px; height:100px" /><div style="position:absolute; width:100px; height:100px; opacity:0">&nbsp;</div>

Source

2011-10-05 16:31:22 user980779

Touch Events sur SVG avec JQuery mobile

Répondre

Questions connexes