Autor Zpráva
pozadííí
Profil *
Jak vložím obrázkové pozadí přez celou šířku stránky?
Se zachováním poměru stran pozadí. Bez opakování.

Např. kdybych chtěl vložit tento wallpaper jako pozadí stránky.

Děkuji.
Sennin
Profil
Nazdar pozadííí
Napr.
html { 
  background: url(cesta/k-tvojmu-obrazku.xx) repeat-y center center fixed; 
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}
pozadííí
Profil *
To je ONO, super.

Jen se mi ale nezobrazuje vrchní část obrázku.


Sennin:
To je ONO, super.

Jen se mi ale nezobrazuje vrchní část obrázku.
juriad
Profil
pozadííí:
To je logické, když Sennin obrázek centruje. Změň jeden center na top.
pozadííí
Profil *
juriad:
Obrázek je asi ,,dlouhej" takže je oříznutý spodek.
Stránka se může rolovat.

Děkuji za trpělivost.
pozadííí
Profil *
pozadííí:
Nepodařilo se mi odkrýt spodek té fotky.
Taps
Profil
pozadííí:
http://jecas.cz/obrazkove-pozadi
pozadííí
Profil *
Hraju si s tím a naprosto o ničem :(

Buď se mi pozadí roztáhne na šířku a spodní část nejde vidět
a nezobrazí se ani posuvník.
nebo se mi to vyplní na výšku a na stranách je býlí pruh.


Řešení, vložit tam posuvník, aby se zobrazovala celý obrázek, ne?
Trejpa
Profil
pozadííí:
a nezobrazí se ani posuvník.
Jistě že ne, obrázek z pozadí nedokáže určit výšku elementu. Můžeš tomu elementu, pro který nastavuješ pozadí, zadat min-height: 1200px;, kde číslo označuje výšku použitého obrázku.

Bílý. Ach jo.
pozadííí
Profil *
posuvník se sice zobrazil, ale
neodkryl tu spodní část pozadí.


:(
Trejpa
Profil
pozadííí:
S tím přesným zadáním hodnoty jsem se unáhlil, protože není dopředu známá po zvětšení. Musel by ji vypočítat JavaScript na základě znalosti šířky okna pro BODY nebo konkrétního elementu a poměru stran obrázku. Nicméně i tak mi to funguje, nic se neschovává.
Str4wberry
Profil
Musel by ji vypočítat JavaScript na základě znalosti šířky okna pro BODY nebo konkrétního elementu a poměru stran obrázku.

Myslím, že nemusel: Výška závislá na šířce
Trejpa
Profil
Str4wberry:
A jak do toho elementu dáš obsah tak, aby ho v případě větší délky roztáhl? Tím procentním paddingem možná nasimuluješ vlastnost height, ale těžko min-height.
juriad
Profil
Trejpa:
Že těžko? http://kod.djpw.cz/spgb (Opraveno.)
Trejpa
Profil
juriad:
Nějak z tvého příkladu na první pohled nešlo poznat, kam vložit obrázek a proč jeho místo překrývá žlutý a červený blok, které se stejně podle obsahu nezvýší. Tak jsem to dopracoval.
pozadííí
Profil *
Str4wberry:
Teď můžu posuvníkem vidět clé pozadí.
Na spod, se mi zobrazil bílý širší pruh.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title></title>
<link rel="shortcut icon" href="img/ikonka.ico">
<style type="text/css">
<!--
body {
    background: url(http://2imgs.com/2i/i/54439d6d/5cae14d69adf90a74da4b232285da0da/7bc6d0fa29.f.png) top no-repeat;
    background-size: 100%;
}

</style>
</head>

<body>
<script>
document.body.style= "min-height: "+Math.round(document.body.clientWidth*0.75)+"px;";

</script>
</body>
</html>
Trejpa
Profil
pozadííí:
Na spod, se mi zobrazil bílý širší pruh.
Asi tvůj obrázek nemá poměr stran 4:3 (výška není 75 % šířky).
Math.round(document.body.clientWidth*0.75)

Vaše odpověď


Prosím používejte diakritiku a interpunkci.

Ochrana proti spamu. Napište prosím číslo dvě-sta čtyřicet-sedm: