Nie jest do końca jasne, jakie jest twoje pytanie, ale jeśli chcesz po prostu wyeliminować podwójne kliknięcie, zachowując efekt najechania myszą, moja rada jest taka:]}

• Dodaj efekty hover na touchstart i mouseenter.
• Usuń efekty hover na mouseleave, touchmove i click.

Tło

Aby symulować mysz, przeglądarki takie jak Webkit mobile uruchamiają następujące zdarzenia, jeśli użytkownik dotknie i zwolni palec na dotyku ekran (jak iPad) (źródło: dotyk i mysz na html5rocks.com):

1. touchstart
2. touchmove
3. touchend
Przeglądarka upewnia się, że jest to jedno dotknięcie, a nie podwójne dotknięcie.]}
4. mouseover
5. mouseenter
   • Uwaga : Jeśli mouseover, mouseenter lub mousemove zdarzenie zmienia zawartość strony, następujące zdarzenia nigdy nie są zwolniony.
6. mousemove
7. mousedown
8. mouseup
9. click

nie wydaje się możliwe, aby po prostu powiedzieć przeglądarce webbrowser, aby pominęła zdarzenia myszy.

Co gorsza, jeśli zdarzenie mouseover zmieni zawartość strony, Zdarzenie click nigdy nie zostanie wywołane, jak wyjaśniono w Safari Web Content Guide - Obsługa zdarzeń, w szczególności na rysunku 6.4 w zdarzenia jednym palcem. Czym dokładnie jest "zmiana treści", będzie zależy od przeglądarki i wersji. Odkryłem, że dla iOS 7.0 zmiana koloru tła nie jest (lub już nie?) zmiana treści.

Rozwiązanie Wyjaśnione

Do podsumowania:

• Dodaj efekty hover na touchstart i mouseenter.
• Usuń efekty hover na mouseleave, touchmove i click.

Zauważ, że nie ma żadnej akcji na touchend!

To wyraźnie działa dla zdarzeń myszy: mouseenter i mouseleave (nieco ulepszone wersje mouseover i mouseout) są uruchamiane, a dodawanie i Usuń kursor.

Jeśli użytkownik rzeczywiście clickjest łączem, efekt najechania jest również usuwany. Zapewnia to, że zostanie on usunięty, jeśli użytkownik naciśnie przycisk Wstecz w przeglądarce internetowej.

Działa to również dla zdarzeń dotykowych: na touchstart efekt najechania jest dodawany. Jest to"' nie '" usunięte na touchend. Jest on dodawany ponownie w mouseenter, A ponieważ nie powoduje to żadnych zmian zawartości (został już dodany), wywołane jest również zdarzenie click, a po linku następuje bez potrzeby klikania przez użytkownika jeszcze raz!

Opóźnienie 300ms, które przeglądarka ma między zdarzeniami touchstart i click, jest właściwie dobrze wykorzystane, ponieważ efekt najechania zostanie wyświetlony w tym krótkim czasie.

Jeśli użytkownik zdecyduje się anulować kliknięcie, ruch palca zrobi to tak samo normalnie. Zwykle jest to problem, ponieważ nie jest wywoływane żadne zdarzenie mouseleave, a efekt najazdu pozostaje na swoim miejscu. Na szczęście można to łatwo naprawić, usuwając efekt hover na touchmove.

Uwaga że możliwe jest usunięcie opóźnienia 300ms, na przykład za pomocą biblioteki FastClick , ale nie jest to możliwe dla tego pytania.

Alternatywne Rozwiązania

Znalazłem następujące problemy z następującymi alternatywami:

• wykrywanie przeglądarki: bardzo podatne na błędy. Zakłada, że urządzenie ma mysz lub dotyk, podczas gdy kombinacja obu będzie coraz bardziej powszechna, gdy wyświetlacze dotykowe prolirate.
• CSS media detection: jedyne rozwiązanie CSS-jedyne, jakie znam. Wciąż podatny na błędy i nadal zakłada, że urządzenie ma mysz lub dotyk, podczas gdy oba są możliwe.
• emuluje Zdarzenie kliknięcia w touchend: będzie to nieprawidłowo podążać za linkiem, nawet jeśli użytkownik chciał tylko przewijać lub powiększać, bez zamiaru faktycznego kliknięcia linku.
• użyj zmiennej do powstrzymania zdarzeń myszy: to ustawia zmienną w touchend, który jest używany jako warunek if W kolejnych zdarzeniach myszy, aby zapobiec zmianom stanu w tym momencie. Zmienna jest resetowana w przypadku kliknięcia. Jest to przyzwoite rozwiązanie, jeśli naprawdę nie chcesz efektu najazdu na Interfejsy dotykowe. Niestety, nie działa to, jeśli touchend jest wywoływane z innego powodu i nie jest wywoływane Zdarzenie kliknięcia( np. użytkownik przewijał lub powiększał), a następnie próbuje podążać za łączem za pomocą myszy (np. na urządzeniu z myszką i dotykiem interfejs).

Czytaj Dalej

• http://jsfiddle.net/macfreek/24Z5M / . Przetestuj powyższe rozwiązanie dla siebie w tej piaskownicy.
• http://www.macfreek.nl/memory/Touch_and_mouse_with_hover_effects_in_a_web_browser . ta sama odpowiedź, z nieco większym tłem.
• http://www.html5rocks.com/en/mobile/touchandmouse / . świetny artykuł na temat html5rocks.com o dotyku i myszy w Generale.
• https://developer.apple.com/library/ios/DOCUMENTATION/AppleApplications/Reference/SafariWebContent/HandlingEvents/HandlingEvents.html. Safari Web Content Guide-Obsługa zdarzeń. Zob. w szczególności rysunek 6.4, który wyjaśnia, że po zmianie zawartości podczas zdarzenia mouseover lub mousemove nie są wywoływane żadne dalsze zdarzenia.

Zobacz także iPad/iPhone problem z podwójnym kliknięciem i wyłączanie efektów najazdu w przeglądarkach mobilnych .

Wygląda na to, że jednak istnieje rozwiązanie CSS. Powodem, dla którego Safari czeka na drugie dotknięcie, jest obraz tła (lub elementy), który zwykle przypisujesz w zdarzeniu :hover. Jeśli nie ma żadnych do pokazania-nie będziesz miał żadnych problemów. Rozwiązanie polega na skierowaniu na platformę iOS dodatkowego pliku CSS (lub stylu w przypadku podejścia JS), który nadpisuje: najedź tłem, aby dziedziczyć na przykład i zachować ukryte elementy, które miały być wyświetlane po najechaniu myszą: {]}

Oto przykład CSS i HTML - blok produktów ze starowaną etykietą po najechaniu myszą:

HTML:

<a href="#" class="s"><span class="s-star"></span>Some text here</a>

CSS:

.s {
   background: url(some-image.png) no-repeat 0 0;

}
.s:hover {
   background: url(some-image-r.png) no-repeat 0 0;
}

.s-star {
   background: url(star.png) no-repeat 0 0;
   height: 56px;
   position: absolute;
   width: 72px;
   display:none;
}

.s:hover .s-star {
   display:block;
}

Rozwiązanie (drugi CSS):

/* CSS */
/* Keep hovers the same or hidden */
.s:hover {
   background:inherit;
}
.s:hover .s-star {
   display:none;
}

Zadziałało dla mnie to, co inni już powiedzieli:

Nie pokazuj/Nie ukrywaj elementów po najechaniu kursorem lub mousemove (co jest zdarzeniem w moim przypadku).

Oto co mówi Apple (https://developer.apple.com/library/content/documentation/AppleApplications/Reference/SafariWebContent/HandlingEvents/HandlingEvents.html):

Klikalny element to łącze, element formularza, obszar mapy obrazu lub dowolny inny element za pomocą mousemove, mousedown, mouseup lub onclick handlers

Jeśli użytkownik dotknie klikalnego elementu, zdarzenia pojawią się w następującej kolejności: mouseover, mousemove, mousedown, mouseup I click. Ponadto jeśli zawartość strony zmieni się w zdarzeniu mousemove, nie są wysyłane żadne kolejne zdarzenia w sekwencji.{[15] } to zachowanie pozwala użytkownikowi dotknąć nowej zawartości.

Możesz więc użyć rozwiązania @woop: wykryć userAgent, sprawdzić, czy jest to urządzenie iOS, a następnie powiązać Zdarzenie. Skończyło się na użyciu tej techniki, ponieważ to odpowiada moim potrzebom i ma większy sens, nie wiązaj wydarzeń hover, gdy tego nie chcesz.

$("body").on("mouseover", function() {
       document.getElementsByTagName("my-class")[0].style.display = 'block'; //show element
       document.querySelector(".my-selector div").style.display = 'none'; // hide element
});

To będzie działać na wersji desktopowej i nie zrobi nic na wersji mobilnej.

$("body").on("mouseover", function() {
   if (document.getElementsByTagName && document.querySelector) { // check compatibility
       document.getElementsByTagName("my-class")[0].style.display = 'block'; //show element
       document.querySelector(".my-selector div").style.display = 'none'; // hide element
    } else {
        $(".my-class").show();
        $(".my-selector div").hide();
    }
});

Rozwiązanie Cduruka było dość skuteczne, ale spowodowało problemy w kilku częściach mojej strony. Ponieważ używałem już jQuery, aby dodać klasę CSS hover, najprostszym rozwiązaniem było po prostu nie dodawać klasy CSS hover na urządzeniach mobilnych (a dokładniej, aby dodać ją tylko wtedy, gdy nie na urządzeniu mobilnym).

Oto ogólna idea:

var device = navigator.userAgent.toLowerCase();
var ios = device.match(/(iphone|ipod|ipad)/);

if (!(ios)) {
    $(".portfolio-style").hover(
        function(){
            $(this).stop().animate({opacity: 1}, 100);
            $(this).addClass("portfolio-red-text");
        },
        function(){
            $(this).stop().animate({opacity: 0.85}, 100);
            $(this).removeClass("portfolio-red-text");
        }
    );
}

*kod skrócony dla celów ilustracyjnych

Myślę, że byłoby mądrze spróbować mouseenter zamiast mouseover. To jest to, co jest używane wewnętrznie podczas wiązania z .hover(fn,fn) i jest ogólnie tym, czego chcesz.

Miałem następujące problemy z istniejącymi rozwiązaniami i znalazłem coś, co wydaje się rozwiązać wszystkie z nich. Zakłada to, że dążysz do czegoś między przeglądarkami, między urządzeniami i nie chcesz, aby urządzenie wąchało.

Problemy, które to rozwiązuje

Using just touchstart or touchend:

• powoduje, że zdarzenie uruchamia się, gdy ludzie próbują przewijać zawartość i przypadkiem trzymają palec nad tym elementem, gdy zaczynają przesuwać - nieoczekiwane wywołanie akcji.
[[28]}może spowodować uruchomienie zdarzenia na longpress , podobnie jak kliknięcie prawym przyciskiem myszy na pulpicie. Na przykład, jeśli zdarzenie kliknięcia trafi do adresu URL X, a użytkownik długo naciska, aby otworzyć X w nowej karcie, użytkownik będzie zdezorientowany, aby znaleźć X otwarte w obu kartach. W niektórych przeglądarkach (np. iPhone) może to nawet uniemożliwić wyświetlenie menu z długim naciśnięciem.

Wywołanie mouseover zdarzeń na touchstart i mouseout na touchmove ma mniej poważne konsekwencje, ale przeszkadza z zachowaniem przeglądarki, na przykład:

• długie naciśnięcie wywołałoby mouseover, który nigdy się nie kończy.
• wiele przeglądarek na Androidzie traktuje lokalizację palca na touchstart Jak mouseover, czyli mouseouted na następnym touchstart. Jednym ze sposobów, aby zobaczyć zawartość mouseover w Androidzie, jest dotknięcie interesującego obszaru i poruszanie palcem, lekko przewijając stronę. Traktowanie touchmove jako mouseout łamie to.

Rozwiązanie

W teorii, można po prostu dodaj flagę z touchmove, ale iphone uruchamia touchmove, nawet jeśli nie ma ruchu. Teoretycznie można po prostu porównać Zdarzenie touchstart i touchend pageX i pageY ale na iPhone ' ach nie ma touchend pageX lub pageY.

Więc niestety, aby pokryć wszystkie bazy, To kończy się trochę bardziej skomplikowane.

$el.on('touchstart', function(e){
    $el.data('tstartE', e);
    if(event.originalEvent.targetTouches){
        // store values, not reference, since touch obj will change
        var touch = e.originalEvent.targetTouches[0];
        $el.data('tstartT',{ clientX: touch.clientX, clientY: touch.clientY } );
    }
});
$el.on('touchmove', function(e){
    if(event.originalEvent.targetTouches){
        $el.data('tstartM', event.originalEvent.targetTouches[0]);
    }
});

$el.on('click touchend', function(e){
    var oldE = $el.data('tstartE');
    if( oldE && oldE.timeStamp + 1000 < e.timeStamp ) {
        $el.data('tstartE',false);
        return;
    }
    if( $el.data('iosTouchM') && $el.data('tstartT') ){
        var start = $el.data('tstartT'), end = $el.data('tstartM');
        if( start.clientX != end.clientX || start.clientY != end.clientY ){
            $el.data('tstartT', false);
            $el.data('tstartM', false);
            $el.data('tstartE',false);
            return;
        }
    }
    $el.data('tstartE',false);

W teorii, istnieją sposoby, aby uzyskać dokładny czas używany dla longpress zamiast tylko za pomocą 1000 jako przybliżenie, ale w praktyce nie jest to takie proste i najlepiej jest użyć rozsądnego proxy .

Odpowiedź Macfreaka była dla mnie niezwykle pomocna. Oto praktyczny kod na wypadek, gdyby ci pomógł.

PROBLEM - Zastosowanie touchend oznacza, że za każdym razem, gdy przewiniesz palec nad elementem, reaguje on tak, jakbyś go nacisnął, nawet jeśli tylko próbujesz przewinąć poprzedni.

Tworzę efekt z jQuery, który zanika linia pod niektórymi przyciskami, aby "podświetlić" zawinięty przycisk. Nie chcę, żeby to oznaczało, że musisz nacisnąć przycisk dwa razy na dotyku urządzenia, aby przejść do linku.

Oto Przyciski:

<a class="menu_button" href="#">
    <div class="menu_underline"></div>
</a>

Chcę, aby div "menu_underline" znikał przy mouseover i znikał przy mouseout. Ale chcę, aby urządzenia dotykowe mogły podążać za linkiem jednym kliknięciem, a nie dwoma.

Rozwiązanie - Oto jQuery, aby to działało:

//Mouse Enter
$('.menu_button').bind('touchstart mouseenter', function(){
    $(this).find(".menu_underline").fadeIn();
});

//Mouse Out   
$('.menu_button').bind('mouseleave touchmove click', function(){
    $(this).find(".menu_underline").fadeOut();
});

Wielkie dzięki za pomoc przy tym MacFreak.

Właśnie się dowiedziałem, że działa, jeśli dodasz pusty słuchacz, nie pytaj mnie dlaczego, ale testowałem go na iPhone i iPad z iOS 9.3.2 i działało dobrze.

if(/iPad|iPhone|iPod/.test(navigator.userAgent) && !window.MSStream){
    var elements = document.getElementsByTagName('a');
    for(var i = 0; i < elements.length; i++){
        elements[i].addEventListener('touchend',function(){});
    }
}

Nie trzeba robić zbyt skomplikowanych.

$('a').on('touchend', function() {
    $(this).click();
});

Myślę, że Twoje łącza nie mają zdarzenia onmouseover, gdzie 1 dotknięcie aktywuje onmouseover, a podwójne dotknięcie aktywuje łącze. ale idk. Nie mam iPada. Myślę, że musisz użyć gestów / wydarzeń dotykowych.

Https://developer.apple.com/documentation/webkitjs

Miałem ten sam problem, ale nie na urządzeniu dotykowym. Zdarzenie jest wyzwalane za każdym kliknięciem. Jest coś o kolejkowaniu zdarzeń lub tak.

Jednak moje rozwiązanie było takie: Na click event(lub touch?) ustawiasz timer. Jeśli link zostanie ponownie kliknięty W x ms, po prostu zwracasz false.

Aby ustawić timer dla każdego elementu, możesz użyć $.data().

Może to również rozwiązać opisany powyżej problem @ Ferdy.

Jeśli używasz Modernizr, jest to bardzo łatwe w użyciu Modernizr.Dotknij, jak wspomniano wcześniej.

var deviceAgent = navigator.userAgent.toLowerCase();

var isTouchDevice = Modernizr.touch || 
(deviceAgent.match(/(iphone|ipod|ipad)/) ||
deviceAgent.match(/(android)/)  || 
deviceAgent.match(/(iemobile)/) || 
deviceAgent.match(/iphone/i) || 
deviceAgent.match(/ipad/i) || 
deviceAgent.match(/ipod/i) || 
deviceAgent.match(/blackberry/i) || 
deviceAgent.match(/bada/i));

function Tipsy(element, options) {
    this.$element = $(element);
    this.options = options;
    this.enabled = !isTouchDevice;
    this.fixTitle();
};

Jeśli nie korzystasz z Modernizr, możesz po prostu zastąpić powyższą funkcję Modernizr.touch ('ontouchstart' in document.documentElement)

Należy również pamiętać, że testowanie User agent iemobile zapewni szerszy zakres wykrytych urządzeń mobilnych Microsoft niż Windows Phone.

Możesz użyć click touchend,

Przykład:

$('a').on('click touchend', function() {
    var linkToAffect = $(this);
    var linkToAffectHref = linkToAffect.attr('href');
    window.location = linkToAffectHref;
});

Powyższy przykład wpłynie na wszystkie łącza na urządzeniach dotykowych.

Jeśli chcesz kierować tylko konkretne linki, możesz to zrobić, ustawiając na nich klasę, czyli:

HTML:

<a href="example.html" class="prevent-extra-click">Prevent extra click on touch device</a>

Jquery:

$('a.prevent-extra-click').on('click touchend', function() {
    var linkToAffect = $(this);
    var linkToAffectHref = linkToAffect.attr('href');
    window.location = linkToAffectHref;
});

Jeroen

Napotkałem podobną sytuację, w której miałem zdarzenia powiązane ze Stanami mouseenter/mouseleave / click elementu, jednak na iPhonie użytkownik musiał dwukrotnie kliknąć element, aby najpierw uruchomić Zdarzenie mouseenter, a następnie ponownie uruchomić Zdarzenie click.

Rozwiązałem to używając podobnej metody jak powyżej, ale skorzystałem z jQuery $.wtyczka do przeglądarki (dla jQuery 1.9>) i dodanowyzwalanie zdarzenia do zdarzenia wiązania mouseenter, w następujący sposób:

// mouseenter event
$('.element').on( "mouseenter", function() {
    // insert mouseenter events below

    // double click fix for iOS and mouseenter events
    if ($.browser.iphone || $.browser.ipad) $(this).trigger('click');
});
// mouseleave event
$('.element').on( "mouseleave", function() { 
    // insert mouseout events below
});
// onclick event
$('.element').on( "click", function() {
    // insert click events below
});

The .spust zapobiega trzeba dwukrotnie kliknąć element, wypalając .kliknij event handler po kliknięciu myszką (lub pierwszym kliknięciu) elementu podczas wyświetlania na iPhone ' ach lub iPadach. Może nie być najbardziej eleganckim rozwiązaniem, ale działa świetnie w moim przypadku i wykorzystuje wtyczkę, którą już miałem na miejscu i wymagał ode mnie dodania pojedynczej linii kodu, aby moje istniejące zdarzenia działały pod tymi urządzeniami.

Możesz dostać jQuery $.wtyczka przeglądarki tutaj: https://github.com/gabceb/jquery-browser-plugin

Tylko poprawa, aby uniknąć przekierowania, gdy przesuniesz palec na link przez pomyłkę.

// tablet "one touch (click)" X "hover" > link redirection
$('a').on('touchmove touchend', function(e) {

    // if touchmove>touchend, set the data() for this element to true. then leave touchmove & let touchend fail(data=true) redirection
    if (e.type == 'touchmove') {
        $.data(this, "touchmove_cancel_redirection", true );
        return;
    }

    // if it's a simple touchend, data() for this element doesn't exist.
    if (e.type == 'touchend' && !$.data(this, "touchmove_cancel_redirection")) {
        var el = $(this);
        var link = el.attr('href');
        window.location = link;
    }

    // if touchmove>touchend, to be redirected on a future simple touchend for this element
    $.data(this, "touchmove_cancel_redirection", false );
});

Zainspirowany Macfreakiem, stworzyłem coś, co dla mnie działa.

Ta metoda js zapobiega przyklejaniu się hover do iPada i zapobiega rejestrowaniu kliknięć jako dwóch kliknięć w niektórych przypadkach. W CSS, jeśli masz jakieś: hover psudo klas w css, zmień je na .hover na przykład .some-class: hover to .jakaś Klasa.hover

Przetestuj ten kod na iPadzie, aby zobaczyć, jak css i metoda js zachowują się inaczej (tylko w efekcie hover). Przycisk CSS nie ma fantazji kliknij alert. http://jsfiddle.net/bensontrent/ctgr6stm/

function clicker(id, doStuff) {
  id.on('touchstart', function(e) {
    id.addClass('hover');
  }).on('touchmove', function(e) {
    id.removeClass('hover');
  }).mouseenter(function(e) {
    id.addClass('hover');
  }).mouseleave(function(e) {
    id.removeClass('hover');
  }).click(function(e) {
    id.removeClass('hover');
    //It's clicked. Do Something
    doStuff(id);
  });
}

function doStuff(id) {
  //Do Stuff
  $('#clicked-alert').fadeIn(function() {
    $(this).fadeOut();
  });
}
clicker($('#unique-id'), doStuff);

button {
  display: block;
  margin: 20px;
  padding: 10px;
  -webkit-appearance: none;
  touch-action: manipulation;
}
.hover {
  background: yellow;
}
.btn:active {
  background: red;
}
.cssonly:hover {
  background: yellow;
}
.cssonly:active {
  background: red;
}
#clicked-alert {
  display: none;
}

<button id="unique-id" class="btn">JS Hover for Mobile devices<span id="clicked-alert"> Clicked</span>

</button>
<button class="cssonly">CSS Only Button</button>
<br>This js method prevents hover from sticking on an ipad, and prevents the click registering as two clicks. In CSS, if you have any :hover in your css, change them to .hover For example .some-class:hover to .some-class.hover

Aby linki działały bez przerywania przewijania touch, rozwiązałem to za pomocą zdarzenia " tap " jQuery Mobile:

    $('a').not('nav.navbar a').on("tap", function () {
        var link = $(this).attr('href');
        if (typeof link !== 'undefined') {
            window.location = link;
        }
    });

Jestem za późno, wiem, ale to jedno z najłatwiejszych obejść, jakie znalazłem:

    $('body').on('touchstart','*',function(){   //listen to touch
        var jQueryElement=$(this);  
        var element = jQueryElement.get(0); // find tapped HTML element
        if(!element.click){
            var eventObj = document.createEvent('MouseEvents');
            eventObj.initEvent('click',true,true);
            element.dispatchEvent(eventObj);
        }
    });

Działa to nie tylko dla linków (znaczników kotwicznych), ale także dla innych elementów. Mam nadzieję, że to pomoże.

Ten krótki fragment wydaje się działać. Wywołanie zdarzenia kliknięcia po kliknięciu łącza:

  $('a').on('touchstart', function() {
    $(this).trigger('click');
  });

Żadna z innych odpowiedzi nie działa dla mnie. Moja aplikacja ma wiele słuchaczy zdarzeń, własne pola wyboru i linki, które mają listener i linki bez listener.

Używam tego:

var selector = "label, a, button";
var timer;
var startX;
var startY;
$(document).on("click", selector, function (e) {
    if ($(this).data("touched") === true) {
        e.stopImmediatePropagation();
        return false;
    }
    return;
}).on("touchend", selector, function (e) {
    if (Math.abs(startX - e.originalEvent.changedTouches[0].screenX) > 10 || Math.abs(startY - e.originalEvent.changedTouches[0].screenY) > 10)
        // user action is not a tap
        return;
    var $this = $(this);
    // Visit: http://stackoverflow.com/questions/1694595/can-i-call-jquery-click-to-follow-an-a-link-if-i-havent-bound-an-event-hand/12801548#12801548
    this.click();
    // prevents double click
    $this.data("touched", true);
    if (timer)
        clearTimeout(timer);
    setTimeout(function () {
        $this.data("touched", false);
    }, 400);
    e.stopImmediatePropagation();
    return false;
}).on("touchstart", function (e) {
    startX = e.originalEvent.changedTouches[0].screenX;
    startY = e.originalEvent.changedTouches[0].screenY;
});

Możesz sprawdzić navigator.userAgent tak:

if(!navigator.userAgent.match(/iPhone/i) || !navigator.userAgent.match(/iPad/i)) {
    //bind your mouseovers...
}

Mozilla/5.0 (Linux; U; Android 2.0.1; en-us; Droid Build/ESD56) AppleWebKit/530.17 (KHTML, like Gecko) Version/4.0 Mobile Safari/530.17

Ciąg iPhone ' a jest podobny. Jeśli tylko ekran dla iPhone, iPod, iPad, Android i Blackberry można uzyskać większość handheldów, ale nie wszystkich.

Po prostu wykonaj zapytanie CSS media, które wyklucza tablety i urządzenia mobilne i umieść tam kursor. Nie potrzebujesz do tego jQuery ani JavaScript.

@media screen and (min-device-width:1024px) {
    your-element:hover {
        /* Do whatever here */
    }
}

I pamiętaj, aby dodać to do głowy html, aby upewnić się, że oblicza się z rzeczywistych pikseli, a nie rozdzielczości.

<meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no" />