Fiksirana pozadina kad se uveliča sajt?

Fiksirana pozadina kad se uveliča sajt?

offline
  • Pridružio: 14 Feb 2011
  • Poruke: 941

Nisam znao kako da napišem šta mi je potrebno u naslovu, pa ću ovde opsiati.

Videh na sajtu http://www.klopanaklik.com/ jednu jako dobru stvar koja meni baš treba za moj sajt koji je nedavno pokrenut. Naime, kada približite/odaljite sadržaj (zoom/zoom out) pozadina ostaje ista, ona se ne uveličava niti smanjuje. Najbolje je da odete na taj sajt pa vidite o čemu se radi.

Ja to želim da ubacim na http://zrenjaninskijelovnik.rs/, tu bi ta opcija dobro došla jer za pozadinu stoje slike jela.

Kako to uraditi? Imate li neku ideju? Da li je teško? U kom jeziku se radi (html,php,css,js..) ? Ako neko išta zna bilo bi od pomoći. Hvala unapred!



Registruj se da bi učestvovao u diskusiji. Registrovanim korisnicima se NE prikazuju reklame unutar poruka.
offline
  • Pridružio: 06 Sep 2008
  • Poruke: 150
  • Gde živiš: Obrenovac

Ako sam dobro razumeo, ti želiš ovo što sam ja primenio na orkestarmisasnala.com/. Sajt je još uvek u fazi izrade, ali može da se vidi to žto ti želiš. Ako je to to, objasniću ti kako se to radi.

Pozzzz...

P.S. Nemojte da me kritikujete za izbor pozadinske slike sa ovim drečavim bojama, jer je baš nju hteo Miša Šnala... LOL



offline
  • Dusan Kostic
  • @kosticdk
  • Pridružio: 24 Avg 2011
  • Poruke: 300
  • Gde živiš: Beograd

Koristi ovu skriptu http://srobbin.com/jquery-plugins/backstretch/

Pozovi ovaj kod na dnu stranice, on zahteva jquery 1.4.2 ili noviju verziju i naravno jquery.backstretch.min.js.
<script type="text/javascript">           $.backstretch("http://dl.dropbox.com/u/515046/www/garfield-interior.jpg"); </script>

Samo zimeni sledecu liniju koda $.backstretch("folder/pozadina.jpg");, stavi putanju do tvoje pozadine.
Pozdrav! Smile

offline
  • Pridružio: 14 Feb 2011
  • Poruke: 941

Hvala ljudi, ovih dana ću testirati! Smile

offline
  • Pridružio: 06 Sep 2008
  • Poruke: 150
  • Gde živiš: Obrenovac

Može ovo i bez jquery. Samo CSS. Mnogo je jednostavnije. A ti biraj, hoces li ovo sa JS ili da ti napisem CSS.

Pozzz...

offline
  • Code Developer
  • Pridružio: 23 Okt 2011
  • Poruke: 163

Probaj nesto slicno ovome, mislim da je to sto tebi treba najjednostavnije preko css-a:


body {
background: #000 url(images/pozadina.jpg) no-repeat center fixed;
}

offline
  • Dusan Kostic
  • @kosticdk
  • Pridružio: 24 Avg 2011
  • Poruke: 300
  • Gde živiš: Beograd

stogor ::Može ovo i bez jquery. Samo CSS. Mnogo je jednostavnije. A ti biraj, hoces li ovo sa JS ili da ti napisem CSS.

Pozzz...


Lackeeee ::Probaj nesto slicno ovome, mislim da je to sto tebi treba najjednostavnije preko css-a:


body {
background: #000 url(images/pozadina.jpg) no-repeat center fixed;
}


Procitajte opet sta je respectzr trazio, pa tek onda pokusajte da mu pomognete, to sto pricate za css nema veze s' vezom.

offline
  • Pridružio: 06 Sep 2008
  • Poruke: 150
  • Gde živiš: Obrenovac

Citat:... to sto pricate za css nema veze s' vezom.
E pa ime veze s vezom. To što rešenje može da bude sa jquery, ne znači da ne može drugačije. Code koji navodi Lackeeee nije dovoljan, ali ipak može sa CSS-om. A evo i kako:
CSS:
* { padding: 0; margin: 0; } html, body { height:100%; width:100%; margin: 0; padding: 0; } body { /* definicije fonta, i ostalog za body... */ } #omotac { margin:0 auto; width:980px; position:relative; } #sajt { position:absolute; width:980px; z-index:70; margin: 0 auto; width: 980px; } #bg { min-height: 100%; min-width: 1024px; width: 100%; height: auto; position: fixed; top: 0; left: 0; }
HTML:
<body> <div id="omotac"> <div id="sajt">     <!-- Celokipni sadržaj sajta ukljušujući: header, glavni deo sajta i footer --> <!-- End sajt --></div> <img id="bg" alt="background" src="putanja_do_slike/naziv_slike.jpg" /> <!-- End omotac --></div> </body>
Ovde je izostavljen head, već je samo ono što ide unutar <body> i </body> tagova. Slika treba da bude dovoljne veličine da pokrije ceo ekran, a najbolje je da bude 1024x768px ili nešto veća.

Probaj, pa ćeš videti da je upravo to tražio respectzr i da ovo baš to i radi.

Pozzzzzz....

offline
  • Dusan Kostic
  • @kosticdk
  • Pridružio: 24 Avg 2011
  • Poruke: 300
  • Gde živiš: Beograd

stogor ::Citat:... to sto pricate za css nema veze s' vezom.
E pa ime veze s vezom. To što rešenje može da bude sa jquery, ne znači da ne može drugačije. Code koji navodi Lackeeee nije dovoljan, ali ipak može sa CSS-om. A evo i kako:
CSS:
* { padding: 0; margin: 0; } html, body { height:100%; width:100%; margin: 0; padding: 0; } body { /* definicije fonta, i ostalog za body... */ } #omotac { margin:0 auto; width:980px; position:relative; } #sajt { position:absolute; width:980px; z-index:70; margin: 0 auto; width: 980px; } #bg { min-height: 100%; min-width: 1024px; width: 100%; height: auto; position: fixed; top: 0; left: 0; }
HTML:
<body> <div id="omotac"> <div id="sajt">     <!-- Celokipni sadržaj sajta ukljušujući: header, glavni deo sajta i footer --> <!-- End sajt --></div> <img id="bg" alt="background" src="putanja_do_slike/naziv_slike.jpg" /> <!-- End omotac --></div> </body>
Ovde je izostavljen head, već je samo ono što ide unutar <body> i </body> tagova. Slika treba da bude dovoljne veličine da pokrije ceo ekran, a najbolje je da bude 1024x768px ili nešto veća.

Probaj, pa ćeš videti da je upravo to tražio respectzr i da ovo baš to i radi.

Pozzzzzz....


Okej, to bi moglo da resi stvar ali ima 2 problema, prvi je taj sto taj tvoj kod nece raditi u IE, ne u svim verzijama, drugi problem je taj sto tvoj kod radi samo kada se sirina i visina ekrana uvecavaju ali ne i kada se smanjuju, znaci radi zoom out, zoom ne radi.

Ko je trenutno na forumu
 

Ukupno su 582 korisnika na forumu :: 14 registrovanih, 4 sakrivenih i 564 gosta   ::   [ Administrator ] [ Supermoderator ] [ Moderator ] :: Detaljnije

Najviše korisnika na forumu ikad bilo je 3466 - dana 01 Jun 2021 17:07

Korisnici koji su trenutno na forumu:
Korisnici trenutno na forumu: babaroga, cole77, cvrle312, djboj, goxin, Ilija Cvorovic, kaptain, lukac, nuke92, perko91, raketaš, stegonosa, VladaKG1980, vlvl