Pomoc - Szukaj - Użytkownicy - Kalendarz
Pełna wersja: Wersja mobilna strony
Forum PHP.pl > Forum > Po stronie przeglądarki
darksiders94
Witam,
Zastanawiam się jaki sposób na wykonanie wersji mobilnej strony jest najlepszy. Są skrypty php które wykrywają urządzenie. Tylko kiedy znalazłem taki skrypt to strona mobilna była na telefonie wyświetlana mimo wybrania opcji (na telefonie) PC. Odpuściłem.. Zabrałem się za Media Query. Tutaj postanowiłem rozpoznanie robić po orientacji, ponieważ telefony mają już wysokie rozdzielczości. Wszystko fajnie, ale strona była wyświetlana bez przybliżenia. Tzn container nie dopasował się do okna przeglądarki. Tak więc pytam, jaki sposób jest dobry i skuteczny?
fate
moim zdaniem lepsze jest responsive design niż wersja mobilna strony, mniej pracy, to ze Tobie sie kontener nie dopasoywał to nie wina media Query tylko Twojego kodu css
michaf1994
Użyj php i dodaj ciasteczka, oraz ?mobile=no itp. Jak znajdę kod to podam jakiego stosuję.


  1. <?php
  2. $useragent=$_SERVER['HTTP_USER_AGENT'];
  3. if(preg_match('/(android|bb\d+|meego).+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|series(4|6)0|symbian|treo|up\.(browser|link)|vodafone|wap|windows (ce|phone)|xda|xiino/i',$useragent)||preg_match('/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|\-[a-w])|libw|lynx|m1\-w|m3ga|m50\/|ma(te|ui|xo)|mc(01|21|ca)|m\-cr|me(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|yas\-|your|zeto|zte\-/i',substr($useragent,0,4)))
  4. {
  5. if($_GET['m']=='no' || ($_COOKIE['m']=='no' &&
  6. $_GET['m']!='yes') ) {
  7. setcookie('m', 'no');
  8. }
  9. else {
  10. setcookie('m', 'yes');
  11. $adres='mobile/';
  12.  
  13. $nagl='Location: '.$adres;
  14. header($nagl);
  15. };
  16. };
  17. ?>
darksiders94
Teraz jeszcze próbowałem z media query i zrobiłem po prostu wszystko duże. Tylko mi się to wydaje bez sensu.. Wcześniej jak zrobiłem to po prostu wyświetlała się strona z tym że mała i dopiero trzeba było sobie powiększyć widok. Chciałem, żeby wyświetlało się od razu dopasowane do okna więc dałem szerokość divom na 100% i wysokość powiększyłem kilka razy. Tak raczej nie powinno się robić.. Co zatem zrobić aby wyświetlało się prawidłowo bez powiększania divów?
michaf1994
Poczekaj. To też gdzieś mam żeby dopasowalo się do rozdziałki telefonu biggrin.gif
darksiders94
Jeeejku Ty masz wszystko biggrin.gif
michaf1994
Ja używam:


<meta name="viewport" content="width=device-width; initial-scale=1; user-scalable: no" />

a tu masz link do strony z artykułem z którego to brałem: Link do artykułu


Od kilku lat piszę strony i mam na pendrive trochę przykladów z ciekawymi rozwiązaniami. wink.gif
darksiders94
Dzięki smile.gif na bank sprawdzę te rozwiązania. Ja się zajmuję tym od roku i baaardzo dużo muszę się jeszcze nauczyć. Co ciekawsze rozwiązania również zachowuje biggrin.gif
michaf1994
Mi to działa. Czasem się coś wysypie, ale to przez to, że moja mobilna wersja ma kilka iframek, więc na to trzeba uważać i poprawiać wyjątkami, ale bez iframe działa bez zarzutu.

darksiders94
Nooo w zasadzie wszystko ladnie pieknie. Tylko jest jeden mankament. Wykrywanie zrobilem po orientacji. Kiedy naciskam na pole formularza i wyskakuje klawiatura w telefonie to strona przelacza sie na tradycyjna. Co moze byc przyczyna?
michaf1994
podaj link to zobaczę, bo nie wiem o co Ci chodzi.
darksiders94
http://stronadwa.cba.pl/
michaf1994
U mnie na telefonie jest ok. Ten długi skrypt co Ci dałem wykrywa tez tablety (mojego napewno) i włącza na wersje komputerową. A ten efekt landscape fajny, ale troszkę u mnie się za bardzo poszerzyła strona. Tak jest jak telefon ma większą rozdzielczośc niż przeglądarka po powiększeniu, dlatego radziłbym zrobić szerokości % i dodać tą tą linijkę o autodopasowaniu i o braku powiększenia, bo trochę niewygodnie jest jak się powiększa sama strona.

Pomyśl też czy jeżdżące tło to dobry pomysł w przypadku mobilnej wersji, bo niestety zawsze tak jest, że przez chwilę widać białe tło.

A strona fajnie wykonana wink.gif gratuluję oka do grafiki. smile.gif
darksiders94
Jak to jezdzace tlo? Background mam fixed.
michaf1994
ten obrazek z ulicą w nocy i informacja o ciasteczkach jeżdżą. mogą być połączone i dlatego. jestem na telefonie teraz to Ci nie powiem, bo w źródło nie wejdę, ale jeżdżą razem.
darksiders94
Postanowiłem skorzystać z tego skryptu. Mam mały problem. Ten skrypt prowadzi do podkatalogu. Ja bym chciał, aby prowadził na subdomenę. Jak tego dokonać?

Albo w ogóle jest skrypt który prowadzi na subdomenę? Nie znam php i nie bardzo wiem jak go edytowac
fate
11 linijka na sztywno:
  1. $adres='http://subdomena.domena.pl';

darksiders94
Wielkie dzięki smile.gif wcześniej próbowałem z samym www ale i tak kierowało do folderu.

Jak usunąć z tego skryptu ciastko lub zmienić je tak aby zawsze przekierowywało?
Kiedy wchodzę na stronę to wszystko śmiga. Kieruje na stronę mobilną i po przełączeniu z powrotem. Lecz gdy już jestem na stronie mobilnej i wejdę na jakąś podstronę to już nie mogę wrócić na normalną wersję strony. Muszę wtedy usunąć m z adresu.
Pomożecie?
To jest wersja lo-fi głównej zawartości. Aby zobaczyć pełną wersję z większą zawartością, obrazkami i formatowaniem proszę kliknij tutaj.
Invision Power Board © 2001-2025 Invision Power Services, Inc.