• Deaktivací „gesta“ deaktivujete touchpad. Rozšíření gest pro Chrome a Firefox

    25. února 2008 v 19:46 Programování gest myší
    • JavaScript

    Mnoho uživatelů Opery a FireFoxu ví o existenci tzv. Mouse Gestures (pro FF existuje stejnojmenný plugin) - gest myši, na která prohlížeč reaguje prováděním různých akcí (např. otevření nového okna, záložky , zpět, vpřed atd. atd.) atd.), jedinou nevýhodou této funkce je, že nedochází k žádné interakci se stránkou, a rozhodl jsem se napsat malou knihovnu, která vývojářům pomůže takovou funkcionalitu na jejich stránky přidat ...

    Na tento moment Knihovna rozumí pouze 8 jednoduchým gestům:

    • Nahoře - podržte tlačítko myši a posuňte kurzor nahoru o 50-200 pixelů (ve výchozím nastavení) a uvolněte, posun podél osy X by měl být alespoň dvakrát menší. než osa y
    • Dole - přesunutí kurzoru dolů
    • Že jo
    A jejich deriváty
    • Vlevo nahoře – posunutí podél os X a Y by se nemělo lišit více než dvakrát
    • Vpravo nahoře
    • vlevo dole
    • vpravo dole
    Chcete-li knihovnu připojit, musíte na svou stránku přidat následující kód:

    Dále zkopírujte následující kód:

    // použití jQuery pro funkci vazby na událost

    // nastavení parametrů
    navigace.minX = 50;
    navigace.minY = 50;
    navigace.maxX = 300;
    navigace.maxY = 300;
    // funkce zpětného volání
    navigace.Vlevo nahoře = funkce (X,Y) ( );
    navigace.Nahoře = funkce (X,Y) ( );
    navigace.Vpravo nahoře = funkce (X,Y) ( );
    navigace.Vlevo = funkce (X,Y) ( );
    navigace.Vpravo = funkce (X,Y) ( );
    navigace.Vlevo dole = funkce (X,Y) ( );
    navigace.Dole = funkce (X,Y) ( );
    navigace.Vpravo dole = funkce (X,Y) ( );


    Toto je příprava na naše „gesta“, první dva řádky jsou nutné k tomu, abychom zavěsili naše dvě funkce na globální události mousedown a mouseup (pomocí knihovny jQuery). Další 4 řádky označují parametry gest, tzn. limity, ve kterých budou pracovat. Dále následuje deklarace 8 funkcí zpětného volání, které jako parametry mají absolutní posun podél os X a Y.

    Abychom se vyhnuli falešným pozitivům našich funkcí, je lepší je navázat na stisknutou klávesu „Ctrl“ (kód klávesy „Ctrl“ je 17, pokud jej chcete změnit – všechny kódy naleznete na stránce http:/ /unixpapa.com/js/key.html):

    $(okno).keydown(funkce(událost)(
    switch(event.keyCode)(
    případ 17:
    $(document).mousedown(navigation.myšídol);
    $(document).mouseup(navigace.mouseup);
    přestávka;
    }
    });

    switch(event.keyCode)(
    případ 17:


    přestávka;
    }
    });

    A takto vypadá kód z mého příkladu:

    funkce mouseGestures()(
    $(okno).keydown(funkce(událost)(
    switch(event.keyCode)(
    //…
    // různé klíče dělají různé věci
    // Různé prohlížeče poskytují různé kódy
    // podrobnosti naleznete zde: unixpapa.com/js/key.html
    //…
    případ 17:
    $(document).mousedown(navigation.myšídol);
    $(document).mouseup(navigace.mouseup);
    přestávka;
    }
    });
    $(okno).keyup(funkce(událost)(
    switch(event.keyCode)(
    případ 17:
    $(document).unbind("myší");
    $(document).unbind("mouseup");
    přestávka;
    }
    });

    Navigace.maxX = 300;
    navigace.maxY = 300;
    navigation.TopLeft = function (X,Y) ( select($("div#left div.top"),Math.abs(X-Y)) );
    navigace.Top = funkce (X,Y) ( select($("div#center div.top"),Y) );
    navigation.TopRight = function (X,Y) ( select($("div#right div.top"),Math.abs(X-Y)) );
    navigace.Vlevo = funkce (X,Y) ( select($("div#left div.middle"),X) );
    navigace.Vpravo = funkce (X,Y) ( select($("div#right div.middle"),X) );
    navigation.BottomLeft = function (X,Y) ( select($("div#left div.bottom"),Math.abs(X-Y)) );
    navigace.Bottom = funkce (X,Y) ( select($("div#center div.dole"),Y) );
    navigation.BottomRight = function (X,Y) ( select($("div#right div.bottom"),Math.abs(X-Y)) );
    }
    funkce select(el,k) (
    rychlost var = 1500;
    přepínač(pravda)(
    případ (k