Pomoc - Szukaj - Użytkownicy - Kalendarz
Pełna wersja: [css] skalowanie obrazka tła
Forum PHP.pl > Forum > Przedszkole
mczlowiek
Witam, czy jest możliwość i jeśli tak to jak dopasować obrazek tła, tak by dopasowywał się do rozmiaru okna?
Przykładowo mam obrazek tła 800/600px,
i teraz jak wielkość okna jest większa to tło się rozciąga i odwrotnie w przypadku mniejszego rozmiaru okna.
Pozdrawiam!
blim
Spróbuj ustawić wielkość obrazka procentowo zamiast w pixelach
mczlowiek
mam tak to wpisane:
  1. body {background:#F2F2F2 url(../images/body_bg.gif) repeat scroll 0 0;}


więc nie za bardzo jest możliwość zastosowania tej wskazowki...

seth-kk
sklaowanie tla nie jest mozliwe za pomoca css
mozesz zapetlac go lub kombinowac wrzucajac <img /> warstwe nizej
Pawel_W
http://www.kurshtml.boo.pl/przyklady/css/tlo_rozmiary.html

tu masz to co potrzebujesz
Gość
da się skalować obrazek tła w css, przykładowy kod wygląda tak:
background-image:url(adres/obrazek.gif); background-attachment: fixed; background-size: 100% 100%;

... uwaga, obrazki w jpg nie wchodzą... zaś opcja background-attachment: fixed; czyni, że tło się nie przesuwa przy przewijaniu treści na stronie (nie wiem czy jest potrzebne przy właściwym skalowaniu)... :3
jak to jest, że wszędzie piszą, że się nie da, a mnie takim prostym sposobem się to udało tongue.gif
pozdrawiam smile.gif
-piotr-
Każdy z tych sposóbów zawodzi.
Prawdziwe skalowanie tła powinno działać tak:

Zdjęcie o dowolnych proporcjach skaluje się do całego ekranu niezależnie czy mamy "stary monitor" czy "panoramiczny" bez wzgledu na przeglądarkę, jej paski narzedzi itp w taki sposób, że pokrywa całą powierzchnię ekranu. Różnice w kształcie okna do wyświetlenia obrazka niweluje się tym, że części skrajne obrazka "wychodzą" poza ekran. W ten sposób obrazek nie jest ani rościągnięty, ani scisniety. Jezeli okno przeglądarki ie jest zmaksymalizowane to mozesz zmieniać jego wymiary. Przy dowolnych proporcach H i V obraze nie zniekształca sie tylko się zmniejsza i zaleznie od wymiarów większe lub mniejsze zewnętrzne fragmenty są wysuwane poza margines.

Jak to zrobić ?
sweter
Robisz warstwę niżej z obrazkiem i za pomocą JavaScript zmieniasz jej położenie i wymiary na zdarzeniu resize,
L0k0
Temat stary ale może komuś się przyda odpowiedź:

  1. background: url(obrazek.jpg) no-repeat scroll center;


Użycie tego rozwiązania skaluje obrazek i nie rozjeżdża się przy skalowaniu okna przeglądarki.

Pozdrawiam!
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.