Obrazek dostosowywany do rozdzielczości

Question

Witam mam wielkie pytanie jak osiągnąć taki efekt http://themeforest.net/item/x-the-theme/full_screen_preview/5871901 chodzi mi głównie o diva - content, jest on dostosowywany do obrazu bez względu czy jest przybliżany czy oddalany. By obraz znikał z zasięgu trzeba suwakiem go przesunąć, jak coś takiego osiągnąć, oraz by obraz nie zmieniał swojej wielkości

Answer 1

Powinno pomóc:
 

klasa { 
  background: url(images/bg.jpg) no-repeat center center fixed; 
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}

 

Comments

nie działa mi jakoś

---

Rozpisz background na attachment, position itd.
 

.bgParallax { 
	background-repeat: no-repeat;
	background-attachment: fixed;
	background-position: center; 
	background-size: cover;
} 

Teraz powinno działać!

 

---

Działa, wcześniej już to ogarnełem ale prosze naj :D

Answer 2

Hej, poczytaj sobie na temat responsywnych obrazków, ogólnie responsywność w przypadku stron www jest cechą, która pozwala dostosować się do rozdzielczości, na której jest wyświetlana/przeglądana.  

http://blog.piotrnalepa.pl/2012/12/06/css-responsywne-obrazki-z-zachowaniem-proporcji/
http://blog.eduweb.pl/przyszlosc-responsywnych-obrazkow/

Answer 3

Polecam strone CSS-Trick 

LINK

Answer 4

Background-size: cover Ci pomoże :)