Problem z suwakiem - Grupy dyskusyjne w eGospodarka.pl

eGospodarka.pl › Grupy › pl.comp.www › Problem z suwakiem

« poprzedni wątek

następny wątek »

Ilość wypowiedzi w tym wątku: 5

1. Data: 2009-01-07 17:45:52
Temat: Problem z suwakiem
Od: s...@i...eu

Witam wszystkich
Mam problem z suwakiem w IE 7. Na stronie mam DIVa o stałej szerokości
i wysokości. W nim chcę wyświetlać zawartość strony np. tekst. Teks
oczywiście jest czasami dłuższy niż wysokość DIVa dlatego w stylach
przypisałem mu parametry overflow-y:auto; i overflow-x:none;. Problem
polega na tym że jak dam w pierwszej linii:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN">

To IE ma problemy z suwakiem w ograniczonym oknie. Teks w oknie ma
przykładowo 10 stron. Cześć suwaka która służy do przesuwania powinna
mieć wysokość około 10% wysokości strony. Niestety wysokość jego jest
około 90% sugerując że stron jest mniej niż dwie. Przy przesuwaniu w
dół wysokość suwaka zmniejsza się i w końcu osiąga prawidłową
wysokość. Problem w tym że jest to uciążliwe i wprowadza w błąd.
Gdy wpiszę:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">

lub ominę tą linijkę to suwak jest ok. Niestety rozjeżdża się co
innego. W IE szerokość padding jest wliczana w szerokość okna, a FF
nie. To samo w dwóch przeglądarkach wygląda zupełnie inaczej. Znika
też padding w obrazkach pod IE, a zależy mi na ramce wokół img.

Co powinienem zrobić by obie przeglądarki interpretowały padding tak
samo jak w pierwszym DOCTYPE, ale by ten suwak prawidłowo działał.
Może wpisuje błędny DOCTYPE? Doświadczenia za dużego nie mam.
Wykorzystuje HTMLa właściwie z różnych źródeł i nie do końca mogę
określić z jaką wersja jest zgodny. Do tego CSS. Z drugiej strony nie
wydaje mi się bym robił coś zupełnie nie standardowego, by wersje
miało to znaczenie.
Ech, jak ja nie lubię tego IE! :/

Za wszelkie sugestie dziękuję.

[ pokaż wiadomość z nagłówkami ]

do góry
2. Data: 2009-01-07 19:22:49
Temat: Re: Problem z suwakiem
Od: Paweł Piskorz <n...@p...nie?>

s...@i...eu pisze:
> Witam wszystkich
> Mam problem z suwakiem w IE 7. Na stronie mam DIVa o stałej szerokości
> i wysokości. W nim chcę wyświetlać zawartość strony np. tekst. Teks
> oczywiście jest czasami dłuższy niż wysokość DIVa dlatego w stylach
> przypisałem mu parametry overflow-y:auto; i overflow-x:none;

Ale masz farta, overflow-x/y będą dopiero w CSS3, chociaż w większości
przeglądarek i IE już działają, zaś wartości none nigdy nie przyjmują:
http://www.w3.org/TR/CSS21/visufx.html#propdef-overf
low
http://www.w3.org/TR/2007/WD-css3-box-20070809/#over
flow
Wystarczy overflow:auto;

> Problem
> polega na tym że jak dam w pierwszej linii:
>
> <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN">
>
> To IE ma problemy z suwakiem w ograniczonym oknie.
[8<]
> Gdy wpiszę:
>
> <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
>
> lub ominę tą linijkę to suwak jest ok.

Hmm, SOA#1. Możesz dać linka do przykładu?

> Ech, jak ja nie lubię tego IE! :/

To dobrze trafiłeś ;)

--
message[autor="PablO"]::after {
content:"Pozdrawiam";
}

[ pokaż wiadomość z nagłówkami ]

do góry
3. Data: 2009-01-07 20:45:48
Temat: Re: Problem z suwakiem
Od: porneL <n...@p...net>

On Wed, 07 Jan 2009 17:45:52 -0000, <s...@i...eu> wrote:

> <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN">
>
> To IE ma problemy z suwakiem w ograniczonym oknie.

To wymusza renderowanie strony za pomocą silnika IE5 (niezależnie od tego, jaką
wersję IE masz). Nie używaj tego DOCTYPE.

> lub ominę tą linijkę to suwak jest ok. Niestety rozjeżdża się co
> innego. W IE szerokość padding jest wliczana w szerokość okna, a FF
> nie. To samo w dwóch przeglądarkach wygląda zupełnie inaczej. Znika
> też padding w obrazkach pod IE, a zależy mi na ramce wokół img.

Poczytaj o box model, quirks mode i przede wszystkim wstaw prawidłowy, pełny DOCTYPE
(np. HTML 4.01 Strict wraz z URL-em), żeby dostać prawidłowe zachowanie CSS. Bez tego
przeglądarki będą emulować bugi starszych przeglądarek.

--
this.author = new Geek("porneL");

[ pokaż wiadomość z nagłówkami ]

do góry
4. Data: 2009-01-07 22:17:45
Temat: Re: Problem z suwakiem
Od: s...@i...eu

> Poczytaj o box model, quirks mode i przede wszystkim wstaw prawidłowy, pełny
DOCTYPE (np. HTML 4.01 Strict wraz z URL-em), żeby dostać prawidłowe zachowanie CSS.
Bez tego przeglądarki będą emulować bugi starszych przeglądarek.

Czy chodzi o:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/
TR/html4/strict.dtd">

Ten DOCTYPE był na samym początku, ale przeglądałem google i szczerze
mówiąc experymentowałem na różnych przykładach. Dla mnie HTML jest
zbyt mało przewidywalny, wole już C++ lub inne języki programowania. W
HTMLu widać trzeba lepiej poznać wroga by na wszystkich przeglądarkach
efekt był taki sam.
W moim przypadku IE wykrzaczał się gdy na końcu tekstu (przed </DIV>)
wstawiony był <hr>. Jak go nie było, lub dałem za nim <br> to pasek
przewijania działał poprawnie. Problem najwyraźniej był pewnie jeszcze
gdzie indziej, bo jak usunąłem position:relative; z DIVa to
niezależnie od <HR> pasek działa prawidłowo. Pewnie jest na to proste
wyjaśnienie, a moje problemy wynikają ze zwykłego niedouczenia się. No
cóż, trzeba zainwestować w dobrą książkę.

Pozdrawiam i dziękuję za odpowiedzi.

[ pokaż wiadomość z nagłówkami ]

do góry
5. Data: 2009-01-08 20:33:22
Temat: Re: Problem z suwakiem
Od: porneL <n...@p...net>

On Wed, 07 Jan 2009 22:17:45 -0000, <s...@i...eu> wrote:

> Dla mnie HTML jest
> zbyt mało przewidywalny, wole już C++ lub inne języki programowania.
> HTMLu widać trzeba lepiej poznać wroga by na wszystkich przeglądarkach
> efekt był taki sam.

Jest pare kruczków, ale większość sprowadza się do robienia prawidłowego kodu pod
normalne przeglądarki i czarnej magii pod IE.

IMHO C++ to akurat słaby przykład przewidywalności i spójności implementacji :)
http://www.google.com/codesearch?q=lang:c%2B%2B+ifde
f+gnuc+__MS
http://www.google.com/search?q=site:yosefk.com+%2Bfq
a+~undefined

> Pewnie jest na to proste
> wyjaśnienie, a moje problemy wynikają ze zwykłego niedouczenia się.

position:relative robi cuda w IE i to akurat nie twoja wina, tylko "speców" z
Microsoftu, którzy wymyślili sobie "hasLayout" (IE<8 zachuje się, jakby do
renderowania jednej strony używał dwóch różnych silników na raz, każdy z innymi
bugami).

--
this.author = new Geek("porneL");

[ pokaż wiadomość z nagłówkami ]

do góry