Сенсорные события в SVG с мобильным JQuery - PullRequest
2 голосов
/ 23 сентября 2011

Я работаю над веб-приложением, содержащим SVG на каждой странице, чтобы перевернуть страницу, я должен использовать пролистывание (влево и вправо). События смахивания обнаруживаются без проблем в div или img и т. Д. Но невозможно обнаружить событие касания во включенном SVG-файле: (

Я использую JQuery 1.6.4 и JQuery mobile 1.0b3.

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>

1 Ответ

0 голосов
/ 05 октября 2011

У меня точно такая же проблема, когда я пытаюсь получить swipe Events в svg, который содержит анимацию при нажатии. Единственный способ получить событие свайпа, который я нашел, - поместить div с наложением svg с непрозрачностью на 0, но тогда я теряю событие click в SVG.

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