[JQuery] - rozmiar viewport jest niezgodny z prawdą

	B O A R D
	» Board » Zadaj pytanie » Archiwum » Szukaj » Stylizacja

M E N U

» Nowości

» Archiwum

» Recenzje / Testy

» Board

» Rejestracja

Szukaj @ TwojePC

	OBECNI NA TPC
	» Shark20 02:49 » MARC 02:08 » RoBakk 01:51 » Rybeck 01:27 » Martens 01:06 » rainy 00:57 » spidi 00:42 » Paweł27 00:36 » m&m 00:35 » rzymo 00:35 » b0b3r 00:22 » dugi 00:21 » NWN 00:20 » Logan 00:16 » mnih 00:10 » cVas 00:08 » Wedrowiec 00:08 » Visar 00:06 » Raist 00:04 » muerte 00:04 Dzisiaj przeczytano 41100 postów, wczoraj 25974 Szybkie ładowanie jest: włączone.

ccc

A R C H I W A L N A W I A D O M O Ś Ć

[JQuery] - rozmiar viewport jest niezgodny z prawdą , bwana 19/07/11 11:29
Cześć,

próbuję określić rozmiar (wł. wysokość) wewnętrznej (klienckiej) części okna przeglądarki używając do tego JQuery (1.6.2). $(document).height() zwraca mi wartości rozmijające się z prawdą - większe o kilkadziesiąt do nawet stu pikseli (im niższe okno, tym większa różnica liczona w pikselach).

wykonuję taki oto kod: var hh=$(window).height();

Żeby się upewnić zrobiłem zrzuty ekranu i w paintcie sprawdziłem liczbę pikseli od górnej do dolnej krawędzi obszaru klienta - no i mam rację - JQ "kłamie".

Co spieprzyłem?

"you don't need your smile when I cut
your throat"

cóż, z braku laku (i odpowiedzi) sam sobie pewnie pomogę , bwana 19/07/11 12:47
zakładam, że dla div-a o wysokości 100%, osadzonego bezpośrednio w body bez marginesów wewnętrznych i zewnętrznych, height() ma szansę zwrócić wartość o którą mi chodzi.
"you don't need your smile when I cut
your throat"
1. otóż nie , bwana 19/07/11 12:55
  div o 100% wysokości, bez marginesów ma taką samą wysokość jak wcześniej zwracana dla $(window), czyli niezgodną z prawdą.
  
  Powracam do pytania - co spieprzyłem?
  
  Chrome, Opera, FF5, IE9 - wszystkie łżą jak psy.
  
  Niestety, na "forach" dyskusje na ten temat dotyczą JQ w wersji 1.2.x, a wnioski z nich są nierelewantne.
  "you don't need your smile when I cut
  your throat"
  1. Tez mi sie zdaza rozmawiac sam ze soba. Ale pociesze cie ze twoj watek jest czytany ;) , ptoki 19/07/11 13:33
    Kiedys z tym walczylem ale nie pamietam o co sie rozbilem.
    1. to tzw. dialog wewnętrzny z publicznym interfejsem , bwana 19/07/11 13:53
      ;-D
      "you don't need your smile when I cut
      your throat"
      1. Ale czasem pozwala poukladac mysli , ptoki 19/07/11 15:01
        I wtedy wychodzi takie gwalcenie sluchacza. Idziesz do kogos z problemem i w trakcie tlumaczneia uzmyslawiasz sobie ze przeciez to mozna rozwiazac takitak...
        
        No i sluchacz stoi smutny bezuzyteczny tylko nagadany :)
        :-) , bwana 19/07/11 15:48
        dokładnie tak jest. i pewnie stąd też popularność blogów (a kiedyś - pamiętników)
        "you don't need your smile when I cut
        your throat"
  2. A moze masz tam juz jakas tresc ktora sie nie miesci w okienku? , ptoki 19/07/11 13:35
    Bo jesli tak to moze nawet jak nie ma paska przewijania to ta wartosc zwraca cos niewidocznego wiekszego od okienka...
zaciekawiłeś mnie tym, bo w każdym moim projekcie jest odwołanie do tej funkcji , Grocal 19/07/11 13:39
i co ciekawe - działa poprawnie. Czy najprostszy przykład też zwraca złe wyniki?

http://www.grocal.pl/temp/height.html

Może kwestia deklaracji DOCTYPE? Może jakieś pluginy w przeglądarce ukrywają częściowo "viewport"?
Na pewno, na razie, w ogóle...
Naprawdę, naprzeciwko, stąd...
Ortografia nie gryzie!
1. ależ pokazuje 1600 (poprawnie) na 767 (a powinno 830) , bwana 19/07/11 13:49
  - to w przypadku FF, bo z przeglądarki na przeglądarkę jest inaczej (różna wysokość pasków narzędziowych itepe).
  
  doctype: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/...D/xhtml1-strict.dtd">
  "you don't need your smile when I cut
  your throat"
  1. troszkę zmodyfikowałem kod , Grocal 19/07/11 14:38
    Teraz dodatkowo wypełnia okno obrazkiem o rozmiarze, jaki javascript odczyta z $(window).height()/width(). Idealnie powinno byc tak, że obrazek dokładnie i co do piksela wypełnia widoczną część okna.
    Na pewno, na razie, w ogóle...
    Naprawdę, naprzeciwko, stąd...
    Ortografia nie gryzie!
    1. ożeszku , bwana 19/07/11 14:51
      W Paint.NET przy mierzeniu obrazka patrzyłem na współrzędne w prawej części belki statusu (pozycja myszy względem top-left obrazu) zamiast z lewej (rozmiar zaznaczenia).
      
      No to się, karwia, przynajmniej wyjaśniło, co spieprzyłem:-D Dziękować.
      
      Już się zgadza (winne były paddingi i marginesy, jak pisał myszon, oraz stan oderwania od świadomości najwyraźniej).
      "you don't need your smile when I cut
      your throat"
najpierw , myszon 19/07/11 13:42
wyzeruj padding, border i margin dla wszystkich elementów strony i wtedy sprawdź. Wszystkich bo body też może mieć marginesy.
1. to w przypadku mierzenia diva 100% na 100% , bwana 19/07/11 13:51
  rozmiary klienta powinny być zależne wyłącznie od wielkości okna przeglądarki, a nie od treści wyświetlanego dokumentu. Tak czy siak w obu przypadkach (window jak i div 100%x100%) wyniki są w danej przeglądarce identyczne i błędne w mojej ocenie.
  "you don't need your smile when I cut
  your throat"
  1. a jak robisz height 100%? , myszon 19/07/11 17:38
    bo to nie takie łatwe. samo napisanie div{height:100%} nie wystarcza.
    1. arjusiur? , bwana 19/07/11 21:15
      ustawiam body {height:100%} i jeśli wewnątrz div ma również height:100% to ma dokładnie wysokość klienta. Oczywiście to w uproszczeniu, bo jeszcze wszelkie padding i margin na zero.
      "you don't need your smile when I cut
      your throat"
      1. to dobrze zrobiłeś , myszon 19/07/11 21:49
        właśnie o to chodziło. Jakbyś dla body nie ustawił wysokości to div{height:100%;} zadziała tak samo jak div{height:auto;}.