 [CSS] "Pochylone" divy |
  |
| [CSS] "Pochylone" divy |
 5.02.2014, 23:43:23
Post
#1
|
|
|
Grupa: Zarejestrowani Postów: 261 Pomógł: 2 Dołączył: 13.05.2012 Ostrzeżenie: (0%) 
 |
Witam, mam od grafika taką koncepcję:
 Chcę to zrobić na podstawie divów (odpowiednia ich transformacja), jednakże zastanawia mnie w jaki sposób to najbezpieczniej wykonać dla bardzo dużych rozdzielczości? Nie chcę, by gdzieś po bokach pojawiły się nieprawidłowości. Czy ktoś już robił podobne rzeczy na stronie i ma na to sposób? Teoretycznie dla rozdzielczosci o szerokosci np. 10 000 powinny powstac trojkaty badz trapezy |
 |
 
|
|
6.02.2014, 12:37:56
Post
#2
|
|
 Grupa: Zarejestrowani Postów: 578 Pomógł: 69 Dołączył: 15.04.2007 Skąd: Wrocław Ostrzeżenie: (0%)
|
No niestety to trochę skomplikowane.
Podam link do tutoriala na dziwne kształty diva: LINK Jeśli we wszystkich 3 divach chcesz zawartość to będziesz musiał je nałożyć na siebie i użyć z-index. "Teoretycznie dla rozdzielczosci o szerokosci np. 10 000 powinny powstac trojkaty badz trapezy " A to już chyba niemożliwe bo po pewnym czasie powstanie klepsydra. Nie możesz ustalić szerokości? (Tak jak na kwejk.pl jest bardzo wąski div z treścią i marginesy po bokach - im większa rozdzielczość tm większe) Ten post edytował timon27 6.02.2014, 12:38:26 |
|
|
|
|
6.02.2014, 14:43:28
Post
#3
|
|
|
Grupa: Zarejestrowani Postów: 717 Pomógł: 120 Dołączył: 18.04.2009 Ostrzeżenie: (0%)
|
A może skorzystasz z SVG? Ustalony wektorowy kształt i po prostu skalowanie tego. Proporcje powinny być zachowane.
-------------------- |
|
|
|
|
6.02.2014, 14:46:43
Post
#4
|
|
|
Grupa: Zarejestrowani Postów: 1 240 Pomógł: 278 Dołączył: 11.03.2008 Ostrzeżenie: (0%)
|
Możesz do tego użyć Canvas - łatwo pobierzesz rozmiar okna i dostosujesz rysowane obiekty - minusem jest brak wsparcia w niektórych przeglądarkach (głównie IE).
Z drugiej strony taki obrazek nie powinien zajmować dużo ponieważ posiada tylko kilka kolorów. Ten post edytował markuz 6.02.2014, 14:48:04 -------------------- |
|
|
|
|
6.02.2014, 14:57:25
Post
#5
|
|
|
Grupa: Zarejestrowani Postów: 717 Pomógł: 120 Dołączył: 18.04.2009 Ostrzeżenie: (0%)
|
Cytat Możesz do tego użyć Canvas - łatwo pobierzesz rozmiar okna i dostosujesz rysowane obiekty - minusem jest brak wsparcia w niektórych przeglądarkach (głównie IE) armatę na muchę... poza tym jednym z problemów z Canvasem jest to, że działa na pikselach, a nie wektorach - więc przy dużych rozmiarach płótna zwyczajnie zamula (co widać szczególnie, jak są jakieś animacje). chyba jednak lepiej to zrobić CSS3 albo SVG... edit: Cytat Teoretycznie dla rozdzielczosci o szerokosci np. 10 000 powinny powstac trojkaty badz trapezy a jaki teraz masz kod? Robisz to pewnie korzystając z jakichś przekształceń perspektywy albo 3d w CSS? Ten post edytował PrinceOfPersia 6.02.2014, 14:59:30 -------------------- |
|
|
|
|
6.02.2014, 15:14:04
Post
#6
|
|
|
Grupa: Zarejestrowani Postów: 1 890 Pomógł: 339 Dołączył: 14.12.2006 Skąd: Warszawa Ostrzeżenie: (0%)
|
Może zwykła transformacja CSS3?
http://jsfiddle.net/LaMw9/1/ + to: http://css-tricks.com/almanac/properties/p/perspective/ Ten post edytował sowiq 6.02.2014, 15:23:43 |
|
|
|
|
|
Wersja Lo-Fi | Aktualny czas: 14.08.2025 - 08:06 |
