 Responsive design i kafelki |
  |
| Responsive design i kafelki |
 
Post
#1
|
|
|
Grupa: Zarejestrowani Postów: 42 Pomógł: 0 Dołączył: 10.03.2011 Ostrzeżenie: (0%) 
 |
Witam, potrzebuję stworzyć responsive design oparty na siatce grid, ale nie tylko po szerokości ale też po wysokości (gutter:0). Czyli ekran dzielimy na np. 10 kolumn. Czyli mogę utworzyć kafelki: każdy odpowiednio na szerokość 10%, 20% .. 100%. I do tej pory jest to mega banał. Teraz potrzebuję by każdy ten div był kwadratem! Tak więc np. {width:100%; height:10% } nie jest dla mnie żadnym rozwiązaniem bo nie będzie to zawsze proporcja 1:1.
Chciałbym ominąć JavaScript do wyrównywania kafelków.... Czy ktoś zna jakiś sposób rozwiązania tego lub już coś takiego istnieje z czego mógłbym skorzystać? |
 |
 
|
|
Post
#2
|
|
|
Grupa: Zarejestrowani Postów: 1 890 Pomógł: 339 Dołączył: 14.12.2006 Skąd: Warszawa Ostrzeżenie: (0%)
|
Jeśli dobrze zrozumiałem i chcesz uzależnić wysokość elementu od jego szerokości i dynamicznie zmieniać, to niestety nie zrobisz tego w CSS. Musisz posiłkować się JS.
|
|
|
|
|
Post
#3
|
|
|
Grupa: Zarejestrowani Postów: 42 Pomógł: 0 Dołączył: 10.03.2011 Ostrzeżenie: (0%)
|
Tego się bałem, czyli jedynie wyjście żeby uzyskać kwadraciki to fixed size?
Nie jestem szczęśliwy... (IMG:style_emoticons/default/ohno-smiley.gif) (IMG:style_emoticons/default/sadsmiley02.gif) |
|
|
|
|
Post
#4
|
|
|
Grupa: Zarejestrowani Postów: 1 890 Pomógł: 339 Dołączył: 14.12.2006 Skąd: Warszawa Ostrzeżenie: (0%)
|
Nie. Możesz ustawić procentowo szerokość i za pomocą JS ustawić taką samą wysokość (ta już będzie w px). Ta czynność powinna być powtórzona na zdarzenie window.onResize. Dzięki temu będziesz miał ładne kwadraciki.
PS. w jQuery to 4 linijki kodu. Ten post edytował sowiq 12.06.2013, 19:36:03 |
|
|
|
|
|
Aktualny czas: 15.09.2025 - 06:14 |
