Rozwiązanie Wykrywanie urządzeń mobilnych
Sprawdź na stronie internetowej Detect Mobile Browsers. Istnieje szereg skryptów dla różnych języków, w tym JavaScript, których można użyć do włączenia różnych zachowań po wykryciu przeglądarki mobilnej.
Skrypty domyślnie ładują kolejny adres URL, jeśli wykryje się przeglądarkę mobilną. Został zaprojektowany do ładowania mobilnej wersji witryny, jeśli wykryje urządzenie mobilne.
Jednak z niewielkimi modyfikacjami można użyć skryptu do ustawienia "flagi", której można użyć do określenia, czy wykonać inne zachowanie, ale nadal ładować tę samą witrynę dla wszystkich urządzeń. I zmodyfikowany kod poniżej z wpisem alert("mobile detected") zastępczego poniżej:
isMobile=false;(function(a,b){if(/android.+mobile|avantgo|bada\/|blackberry|blazer|compal|elaine|fennec|hiptop|iemobile|ip(hone|od)|iris|kindle|lge |maemo|midp|mmp|netfront|opera m(ob|in)i|palm(os)?|phone|p(ixi|re)\/|plucker|pocket|psp|symbian|treo|up\.(browser|link)|vodafone|wap|windows (ce|phone)|xda|xiino/i.test(a)||/1207|6310|6590|3gso|4thp|50[1-6]i|770s|802s|a wa|abac|ac(er|oo|s\-)|ai(ko|rn)|al(av|ca|co)|amoi|an(ex|ny|yw)|aptu|ar(ch|go)|as(te|us)|attw|au(di|\-m|r |s)|avan|be(ck|ll|nq)|bi(lb|rd)|bl(ac|az)|br(e|v)w|bumb|bw\-(n|u)|c55\/|capi|ccwa|cdm\-|cell|chtm|cldc|cmd\-|co(mp|nd)|craw|da(it|ll|ng)|dbte|dc\-s|devi|dica|dmob|do(c|p)o|ds(12|\-d)|el(49|ai)|em(l2|ul)|er(ic|k0)|esl8|ez([4-7]0|os|wa|ze)|fetc|fly(\-|_)|g1 u|g560|gene|gf\-5|g\-mo|go(\.w|od)|gr(ad|un)|haie|hcit|hd\-(m|p|t)|hei\-|hi(pt|ta)|hp(i|ip)|hs\-c|ht(c(\-| |_|a|g|p|s|t)|tp)|hu(aw|tc)|i\-(20|go|ma)|i230|iac(|\-|\/)|ibro|idea|ig01|ikom|im1k|inno|ipaq|iris|ja(t|v)a|jbro|jemu|jigs|kddi|keji|kgt(|\/)|klon|kpt |kwc\-|kyo(c|k)|le(no|xi)|lg(g|\/(k|l|u)|50|54|e\-|e\/|\-[a-w])|libw|lynx|m1\-w|m3ga|m50\/|ma(te|ui|xo)|mc(01|21|ca)|m\-cr|me(di|rc|ri)|mi(o8|oa|ts)|mmef|mo(01|02|bi|de|do|t(\-| |o|v)|zz)|mt(50|p1|v)|mwbp|mywa|n10[0-2]|n20[2-3]|n30(0|2)|n50(0|2|5)|n7(0(0|1)|10)|ne((c|m)\-|on|tf|wf|wg|wt)|nok(6|i)|nzph|o2im|op(ti|wv)|oran|owg1|p800|pan(a|d|t)|pdxg|pg(13|\-([1-8]|c))|phil|pire|pl(ay|uc)|pn\-2|po(ck|rt|se)|prox|psio|pt\-g|qa\-a|qc(07|12|21|32|60|\-[2-7]|i\-)|qtek|r380|r600|raks|rim9|ro(ve|zo)|s55\/|sa(ge|ma|mm|ms|ny|va)|sc(01|h\-|oo|p\-)|sdk\/|se(c(\-|0|1)|47|mc|nd|ri)|sgh\-|shar|sie(\-|m)|sk\-0|sl(45|id)|sm(al|ar|b3|it|t5)|so(ft|ny)|sp(01|h\-|v\-|v)|sy(01|mb)|t2(18|50)|t6(00|10|18)|ta(gt|lk)|tcl\-|tdg\-|tel(i|m)|tim\-|t\-mo|to(pl|sh)|ts(70|m\-|m3|m5)|tx\-9|up(\.b|g1|si)|utst|v400|v750|veri|vi(rg|te)|vk(40|5[0-3]|\-v)|vm40|voda|vulc|vx(52|53|60|61|70|80|81|83|85|98)|w3c(\-|)|webc|whit|wi(g |nc|nw)|wmlb|wonu|x700|xda(\-|2|g)|yas\-|your|zeto|zte\-/i.test(a.substr(0,4)))alert("mobile detected")})(navigator.userAgent||navigator.vendor||window.opera,'http://detectmobilebrowser.com/mobile');
Pod koniec tego skryptu, gdzie jest napisane, że wystarczy wymienić alert("mobile detected") z isMobile=true. Jeśli skrypt wykryje przeglądarkę mobilną, ta flaga zostanie ustawiona na true.
Zostawiłem tam alert, aby można było uruchomić skrypt za pomocą różnych urządzeń, aby wyświetlić alert.
Czynniki kształtu i wzornictwa Porady
Teraz chcę podkreślić, że czynniki tworzą dla telefonu, tabletu i komputera są bardzo różne. Dodatkowo sposób interakcji użytkowników z tymi trzema formami jest drastycznie inny. Może to oznaczać, że budowanie jednej witryny dla wszystkich 3 platform może albo zaszkodzić użyteczności, albo uniemożliwić stworzenie najlepszego interfejsu użytkownika dla wszystkich 3 platform.
Z mojego doświadczenia wynika, że witryny mobilne i tablety, z których korzystałem najbardziej, zostały zaprojektowane specjalnie dla tych urządzeń. Innymi słowy, nie były to tylko istniejące strony internetowe lub aplikacje internetowe, które ktoś zmodyfikował, próbując "dopasować" rzeczy do platformy mobilnej i tabletu.
Zamiast tego, wersje mobilne i tablety tych witryn o wysokim stopniu użyteczności zostały zaprojektowane od podstaw, niezależnie od wersji na komputery, dzięki czemu aktualizacje, poprawki błędów, zmiany w projektach itp. Mogą być wykonane po prostu na jedną platformę, więc dwie mogą rozchodzić się niezależnie, aby dopasować przypadki użycia dla użytkowników na każdej platformie.
Na przykład niedawno zbudowałem dwa formularze internetowe, jeden jest przeznaczony dla przeglądarek komputerowych, a drugi przeznaczony jest dla przeglądarek mobilnych. Wersja komputerowa znajduje się w jednym pliku HTML, a wersja mobilna w innym pliku HTML. Wersja mobilna wykorzystuje jQuery Mobile, więc ma dotyk, slajd i inne funkcje, które sprawiają, że interakcja z witryną jest przyjemnością na urządzeniach mobilnych. Wydaje się bardziej podobny do aplikacji mobilnej i wydaje się bardziej "natywny". Wersja na komputery ma więcej elementów interfejsu użytkownika, które zawierają kliknięcia myszy lub skróty klawiaturowe. Wygląda bardziej jak witryna internetowa niż aplikacja mobilna.
Ponieważ nie znam dokładnych informacji o aplikacji, należy oczywiście sprawdzić, co robisz, i zadać sobie pytanie, czy byłoby łatwiejsze i bardziej przyjazne dla użytkownika, jeśli utworzysz telefon komórkowy/wersje tabletu niezależne od wersji na komputery.
Ach, to bardzo przydatne, widziałem to wcześniej, ale nie mogłem go uruchomić. W związku z tym, co powiedziałem, zmieniłem odpowiednie bity, ale wydaje mi się, że mogę uruchomić kod, oto mały przykład tego, co mam: http://pastie.org/3795765 Więc dlatego chcę strzelać kod, jeśli wykryta przeglądarka nie jest mobilna, ale to nie działa, ale nie rozumiem, dlaczego? – Michael
W twoim pastebin masz 'if (isMobile = false) {' kiedy to czego naprawdę chcesz to 'if (isMobile == false) {'. Spróbuj to naprawić i teoretycznie powinieneś. – jmort253
Doskonale, że załatwiłem sprawę, nie wiem, jak tego nie zauważyłem, dzięki stary. Jeśli chodzi o to, co mówisz o budowaniu różnych stron, to coś, co rozważałem i jestem uczciwie chory, prawdopodobnie skończy się w ciągu kilku tygodni, w zależności od tego, jak moje testy trafiają na tablety. W tej chwili jest to szybsza naprawa, aby strona działała początkowo na wszystkich urządzeniach. Dzięki za pomoc! – Michael