Witaj Gościu! ( Zaloguj | Rejestruj )

Forum PHP.pl

 
Reply to this topicStart new topic
> Pobieranie danych i podzial na listy co 4 elementy
IceManSpy
post 26.03.2011, 20:08:52
Post #1





Grupa: Zarejestrowani
Postów: 1 006
Pomógł: 111
Dołączył: 23.07.2010
Skąd: Kraków

Ostrzeżenie: (0%)
-----


Witam

Mam pewną zagwozdkę z którą nie mogę się uporać. Pobieram z bazy danych linki do obrazków. Chcę je teraz wyświetlić na stronie, ale w taki sposób, aby były po 4 w linijce. Robię więc to na listach (poniżej przykład):
  1. <ul>
  2. <li><img src="/obrazy/obraz/mu6oa2mxzczu.png" /></li>
  3. <li><img src="/obrazy/obraz/mu6oa2mxzczu.png" /></li>
  4. <li><img src="/obrazy/obraz/mu6oa2mxzczu.png" /></li>
  5. <li><img src="/obrazy/obraz/mu6oa2mxzczu.png" /></li>
  6. <ul />
A w CSS oczywiście jest jako inline. Teraz aby wyświetlić 2 rząd to robię kolejną listę.

W jaki sposób to zautomatyzować, aby po wielokrotności 4 elementu robiło nową listę? Czy dość poprawnie będzie zrobienie czegoś takiego:
  1. <ul>
  2. <li><img src="/obrazy/obraz/mu6oa2mxzczu.png" /></li>
  3. <li><img src="/obrazy/obraz/mu6oa2mxzczu.png" /></li>
  4. <li><img src="/obrazy/obraz/mu6oa2mxzczu.png" /></li>
  5. <li><img src="/obrazy/obraz/mu6oa2mxzczu.png" /></li>
  6. <br />
  7. <li><img src="/obrazy/obraz/mu6oa2mxzczu.png" /></li>
  8. <li><img src="/obrazy/obraz/mu6oa2mxzczu.png" /></li>
  9. <li><img src="/obrazy/obraz/mu6oa2mxzczu.png" /></li>
  10. <li><img src="/obrazy/obraz/mu6oa2mxzczu.png" /></li>
  11. </ul>

i po 4 elemencie wstawiać br ?

Kompletnie nie mam pomysłu jak to ugryźć :/


--------------------
Go to the top of the page
+Quote Post
emajl22
post 26.03.2011, 20:15:08
Post #2





Grupa: Zarejestrowani
Postów: 273
Pomógł: 21
Dołączył: 28.11.2010

Ostrzeżenie: (10%)
X----


http://nospor.pl/co-trzy-wyswietlanie-danych.html


--------------------
Go to the top of the page
+Quote Post
konole
post 26.03.2011, 20:18:00
Post #3





Grupa: Zarejestrowani
Postów: 275
Pomógł: 32
Dołączył: 21.03.2006
Skąd: Warszawa

Ostrzeżenie: (20%)
X----


A rozmiary obrazków są takie same? Czy każde li musi mieć takie samo width? Bo najprostszym rozwiązaniem jest
Kod
ul {
width: 800px;
}
li {
width: 190px;
margin: 0 5px;
float: left;
list-style-type: none;
}


i wtedy masz co 4 punkty listy nową linię zautomatyzowaną przez CSS.
Go to the top of the page
+Quote Post
JoShiMa
post 26.03.2011, 20:18:21
Post #4





Grupa: Zarejestrowani
Postów: 1 374
Pomógł: 149
Dołączył: 1.03.2006

Ostrzeżenie: (0%)
-----


A nie lepiej div o takiej szerokości, żeby się tylko 4 mieściły? albo w pętli odliczać do 4 i wstawiać </ul><ul>?

Albo podzielić tablicę z danymi na kawałki po 4 szt.


--------------------
Go to the top of the page
+Quote Post
IceManSpy
post 26.03.2011, 20:38:36
Post #5





Grupa: Zarejestrowani
Postów: 1 006
Pomógł: 111
Dołączył: 23.07.2010
Skąd: Kraków

Ostrzeżenie: (0%)
-----


Dziękuję za odpowiedzi smile.gif Są bardzo pomocne, ale nad wybraniem rozwiązania muszę się jeszcze zastanowić smile.gif


--------------------
Go to the top of the page
+Quote Post
konole
post 26.03.2011, 20:44:49
Post #6





Grupa: Zarejestrowani
Postów: 275
Pomógł: 32
Dołączył: 21.03.2006
Skąd: Warszawa

Ostrzeżenie: (20%)
X----


Cytat(JoShiMa @ 26.03.2011, 20:18:21 ) *
A nie lepiej div o takiej szerokości, żeby się tylko 4 mieściły? albo w pętli odliczać do 4 i wstawiać </ul><ul>?

Albo podzielić tablicę z danymi na kawałki po 4 szt.
Ale po co jeszcze zbędny div wstawiać, skoro można ograniczyć blok już w <ul>? Trochę bez sensowne pisanie kodu.
Go to the top of the page
+Quote Post
JoShiMa
post 26.03.2011, 21:06:24
Post #7





Grupa: Zarejestrowani
Postów: 1 374
Pomógł: 149
Dołączył: 1.03.2006

Ostrzeżenie: (0%)
-----


Miałam na myśli divy zamiast ul/li a jeśli to mają być same zdjęcia, bez tytułów i innych dodatków to porostu same zdjęcia z float left i tak ustawionymi marginesami, żeby się mieściły tylko 4 w linii.


--------------------
Go to the top of the page
+Quote Post
CuteOne
post 27.03.2011, 01:08:49
Post #8





Grupa: Zarejestrowani
Postów: 2 958
Pomógł: 574
Dołączył: 23.09.2008
Skąd: wiesz, że tu jestem?

Ostrzeżenie: (0%)
-----


  1.  
  2. $k = 1;
  3. $write = '<ul>';
  4.  
  5. while($row = mysql_fetch_array($select)) {
  6.  
  7. $write .= '<li><img src="/obrazy/obraz/mu6oa2mxzczu.png" /></li>';
  8.  
  9. if($k%4==1) {
  10.  
  11. $write .= '</ul><ul>';
  12. }
  13. $k++;
  14. }
  15.  
  16. $write .= '</ul>'
  17.  
  18. echo $write;


Ten post edytował CuteOne 27.03.2011, 01:51:44
Go to the top of the page
+Quote Post

Reply to this topicStart new topic
1 Użytkowników czyta ten temat (1 Gości i 0 Anonimowych użytkowników)
0 Zarejestrowanych:

 



RSS Wersja Lo-Fi Aktualny czas: 25.04.2024 - 10:20