| Autor | Zpráva | ||
|---|---|---|---|
| camel Profil |
#1 · Zasláno: 1. 8. 2006, 18:51:23
Řeším následující problém. Mám klasické "dlaždicové" pozadí (naskládané 60x60px obrázky) nastavené na FIXED (čili nerolluje). Do středu stránky bych na TOHLE pozadí chtěl "přilepit" další fixní obrázek (jehož okraje přesně navazují na dlaždice pod ním - vytváří to tedy dojem jednoho obrázku).
A chtěl bych se tedy zeptat: JAK TO UDĚLAT? Zkoušel jsem vytvořit DIV, který jsem napozicoval, aby seděl, jak má, ale s tímto řešením souvisí 2 následující problémy: 1) Tomu DIVu je potřeba dát velikost (stejnou jako u obrázku, který "nese"), takže se při menším rozlišení objeví tahací lišta (která je ale úplně zbytečná, pže je pozadí fixní - čili se nic nehýbe). 2) při zavedení dalších DIVů pak při rollování "mizí" spodní okraj obrázku (toho na pozadí prvního DIVu), protože se ten DIV "snaží" rollovat nahoru, a tím tak ubírá plochu na zobrazení obrázku. Teoreticky by šlo nastavit ten první DIV na nějakou obří svislou velikost, ale to by se pak vytvořil o to větší prostor na rollování, což není žádoucí. Drbu se s tím celé odpoledne - dá se to nějak vyřešit bez použití DIVu? Četl jsem o použití dvou různých pozadí (jeden nadefinovaný v html, druhý v body, ale při různých zdrojích obrázků to nefunguje...). Nebo jde nějak přilepit obrázek na stránku bez definování jakýchkoli velikostí, aby neměl vliv na to zatracené rollování? Popř. dá se nějak zakázat konkrétnímu DIVu (tomu s pozadím), aby nemohl aktivovat rollovátko, jako to jde např. u rámů? Zkrátka nevěřím, že se tento zdánlivě primitivní problém nedá vyřešit. Přilepit obrázek na existující pozadí (na pozici center&top), aby neměl jakýkoli vliv na obsah a seděl stále na svém místě. V průběhu dne mě napadlo několik způsobů, jak by to mohlo fungovat, u všech se však po chvíli objevilo nějaké "ale"... část kódu: HTML <head> <title>...</title> <link href="style.css" rel="stylesheet" type="text/css"> </head> <body> <div class="bgr_box"></div> <div class="heading_box"> STYLE body { margin: 0px; padding: 0px; text-align: center; background-image: url(pics/bgr/tile.jpg); background-position: center top; background-attachment: fixed; background-repeat: repeat; background-color: #000000; } .bgr_box { width: 1020px; height: 780px; position: fixed; background-image: url(pics/bgr/summer2oo6.jpg); background-position: center top; background-attachment: fixed; background-repeat: no-repeat; } .heading_box { width: 674px; height: 106px; position: relative; background-image: url(pics/heading.png); top: -770px; } Díky za jakékoli tipy. A prosím čtenáře, kteří by chtěli napsat, ať se na pozadí vykašlu (zvlášť, když je tak velké), ať jdou raději o thread dál. To pozadí je totiž nedílnou součástí designu stránek a je PODMÍNKOU klienta. Dík za pochopení. |
||
| DJ Miky Profil |
#2 · Zasláno: 1. 8. 2006, 18:55:00 · Upravil/a: DJ Miky
camel
Zkuste udělat DIV s tímto CSS: width:100%; height:100%; position:absolute; top:0; left:0; background:url('obrazek_uprostred.jpg') no-repeat center center; Teď z hlavy nevím, jestli tam má být 'middle center' nebo 'center center', to musíte vyzkoušet... :-) EDIT: ale to pozadí Vám tam nebude pasovat vždy - pokud má čtenář třeba větší výšku browseru, tenhle obrázek uprostřed se posune trochu dolů a nebude pasovat na to celostránkové pozadí. Vyřešilo by to jedině zadání pozice absolutně v px. |
||
| camel Profil |
#3 · Zasláno: 1. 8. 2006, 19:21:14
To jsem samozřejmě zkoušel, má to stejný důsledek jako jakékoli jiné přímé nadefinování DIVu - vytvoří to nežádoucí rollovátko, které je úplně k ničemu, pže není co posouvat...
Jinak si cením Vaší snahy o pomoc, ale evidentně jste můj dotaz nepochopil, nebo nečetl celý. Variací na Vaší odpověď jsem v průběhu dnešního dne zkoušel opravdu dost:] Vypisovat je všechny by bylo na dlouho a na spoustu takovýchto "slepých" uliček bych si stejně nevzpomněl:] |
||
| Plaváček Profil |
#4 · Zasláno: 1. 8. 2006, 19:38:38
Váš dotaz jsem nepochopil ani já, možná by pomohla grafická ukázka toho, čeho vlastně chcete dosáhnout.
|
||
| camel Profil |
#5 · Zasláno: 1. 8. 2006, 20:08:30 · Upravil/a: camel
Dobrá, omlouvám se Mikymu, asi nebyl sám, kdo můj dotaz nepochopil a zřejmě to nebyla tak úplně jeho vina:]
Pastovat obrázky by bylo nadlouho, takže aspoň schematicky... Mám dlaždicové pozadí, klasika. Je nadefinováno jako FIXED, čili drží jako přibité. Jeden dílčí čtverec [ ] má rozměry 60px a prohlížeč je naskládá vedle sebe tak, že zaplní celou plochu. Like this: [ ][ ][ ][ ][ ][ ][ ][ ][ ][ ][ ][ ][ ][ ][ ][ ] [ ][ ][ ][ ][ ][ ][ ][ ][ ][ ][ ][ ][ ][ ][ ][ ] [ ][ ][ ][ ][ ][ ][ ][ ][ ][ ][ ][ ][ ][ ][ ][ ] [ ][ ][ ][ ][ ][ ][ ][ ][ ][ ][ ][ ][ ][ ][ ][ ] [ ][ ][ ][ ][ ][ ][ ][ ][ ][ ][ ][ ][ ][ ][ ][ ] [ ][ ][ ][ ][ ][ ][ ][ ][ ][ ][ ][ ][ ][ ][ ][ ] [ ][ ][ ][ ][ ][ ][ ][ ][ ][ ][ ][ ][ ][ ][ ][ ] [ ][ ][ ][ ][ ][ ][ ][ ][ ][ ][ ][ ][ ][ ][ ][ ] Doprostřed takto vytvořené dlaždicové plochy chci přilepit obrázek, aby měl taktéž vlastnosti pozadí (čili opět FIXED, neměl by mít žádný vliv na obsah) do pozice top¢er. Výsledek schematicky vypadá takto: [ ][ ][ ]I * * * * * * * * * * *I[ ][ ][ ] [ ][ ][ ]I * * * * * * * * * * *I[ ][ ][ ] [ ][ ][ ]I * * * * * * * * * * *I[ ][ ][ ] [ ][ ][ ]I * * * * * * * * * * *I[ ][ ][ ] [ ][ ][ ]I * * * * * * * * * * *I[ ][ ][ ] [ ][ ][ ]I________________ I[ ][ ][ ] [ ][ ][ ][ ][ ][ ][ ][ ][ ][ ][ ][ ][ ][ ][ ][ ] [ ][ ][ ][ ][ ][ ][ ][ ][ ][ ][ ][ ][ ][ ][ ][ ] Jak jsem již psal, nadefinování toho obrázku pomocí DIVu má ale za následek, že že se nechová jako pozadí - při rollování onen DIV jede nahoru a jeho spodní okraj tak uřízne kus toho obrázku (protože ten je narozdíl od DIVu fixován a nehýbe se - stejně jako dlaždice...). Navíc při menším rozlišení (kdy se DIV nevejde do okna prohlížeče) aktivuje onen DIV zbytečné rollovátko (protože není CO rollovat, když je pozadí FIXED). Při rollování: [ ][ ][ ]I * * * * * * * * * * *I[ ][ ][ ] [ ][ ][ ]I * * * * * * * * * * *I[ ][ ][ ] [ ][ ][ ]I * * * * * * * * * * *I[ ][ ][ ] - DIV při rollování nahoru "uřízne" obr. [ ][ ][ ][ ][ ][ ][ ][ ][ ][ ][ ][ ][ ][ ][ ][ ] [ ][ ][ ][ ][ ][ ][ ][ ][ ][ ][ ][ ][ ][ ][ ][ ] [ ][ ][ ][ ][ ][ ][ ][ ][ ][ ][ ][ ][ ][ ][ ][ ] [ ][ ][ ][ ][ ][ ][ ][ ][ ][ ][ ][ ][ ][ ][ ][ ] [ ][ ][ ][ ][ ][ ][ ][ ][ ][ ][ ][ ][ ][ ][ ][ ] Chtěl bych jen připomenout, že se bavíme pouze o POZADÍ. Asi tušíte, že v té bílé ploše bude obsah webu, ale to teď vůbec není podstatné. Jde mi jen o ty zatracené posuvníky. Chtěl bych docílit toho, aby měl přilepený obrázek vlastnosti pozadí - jako dlaždice pod ním, aby neaktivoval posouvátka při zmenšení okna, což si myslím, že při použití DIVu není možné (leda u něj zakázat rollovátka, což nevím, jak se dělá, aby to nemělo vliv na zbytek webu...). Chtěl jsem ještě poděkovat Mikymu :] Ta procenta přeci jen pomohla vyřešit jeden problém a posunout se trochu dále. Nicméně se to chová, jak má, pouze při prázdném obsahu, jakmile začnu definovat další DIVy, při rollování popisovaný problém stále přetrvává... :-/ |
||
| Plaváček Profil |
#6 · Zasláno: 1. 8. 2006, 20:13:44
Možná ti pomůže tohle pěkné řešení: http://www.pixy.cz/pixylophone/2004_05_archiv.html#1084198886 . Není to přesně totéž, ale vyplývá z toho možné řešení. Přemýšlet za tebe ale nemohu, za což se hluboce omlouvám :)
|
||
| camel Profil |
#7 · Zasláno: 1. 8. 2006, 20:19:37
Dík za tip, Plaváčku. Pro dnešek už toho mám plné zuby a praská mi hlava, ale zítra si ten tvůj pixyho odkaz pročtu pořádně. Při svém hledání jsem na něj několikrát narazil, ale moc pozornosti jsem mu nevěnoval:]
|
||
|
Časová prodleva: 1 měsíc
|
|||
| liska11 Profil |
#8 · Zasláno: 7. 9. 2006, 20:57:48
možná ti to vůbec neúpomůže ale proč definuješ další divy na ty se vykašli a definuj p nebo span to má skoro stejný výsledek.a nebude se ti to plést
|
||
| tiso Profil |
#9 · Zasláno: 7. 9. 2006, 21:18:30
<body><div id="bg"> pre body nastav jedno pozadie a pre #bg druhé... |
||
|
Časová prodleva: 18 let
|
|||
Toto téma je uzamčeno. Odpověď nelze zaslat.
0