Pomoc - Szukaj - Użytkownicy - Kalendarz
Pełna wersja: "Oplatanie" zdjęcia tekstem
Forum PHP.pl > Forum > Gotowe rozwiązania
trifek
Witam serdecznie,
Mam taką stronę: http://serwer1356363.home.pl/test/szablon/index.html
Strona jest responsywna.

Mam na niej 2 bloki tekstu i zdjęcie po prawej stronie.
Umieściłem te 2 bloki tekstu w 2 osobnych divach/kolumnach.

Problemem jest to, że jak ktoś w przyszłości w CMS wprowadzi dużą ilość tekstu to tekst będzie trzeba w jakiś sposób dzielić pomiędzy te 2 DIVy.

Wie ktoś może jak przerobić ten mój kod, żeby tekst wprowadzony z lewej strony - automatycznie "oplatał zdjęcie" i pojawiał się też z prawej strony (w sposób "ciągły")?

Bardzo proszę o pomoc
Trifek
Niree
Możesz pobawić się w CSS właściwość content: "tekst";
W PHP sprawdzasz, czy $tekst w pierwszym divie wynosi ileś tam znaków, jeśli przekracza, to ucinasz tekst po iluś znakach, a drugą część wrzucasz w drugim divie, w content: "$tekst[1]".

Przykład:
  1. //łączenie z bazą i wyciąganie przykładowej treści
  2. $tekst = $baza['content'];
  3.  
  4. if(strlen($tekst) > 150))
  5. {
  6. $text = str_split($tekst, 150);
  7. echo '<style>#div1 {color: #000; content: "'.$text[0].'";} #div2 {color: #000; content: "'.$text[1].'";}</style>';
  8. }
  9. else
  10. {
  11. echo '<style>#div1 {color: #000; content: "'.$tekst.'";}</style>';
  12. }
  13.  
  14. <div id="div1"></div><div id="div2"></div>/// reszta kodu html, treść ustawi css z powyższego warunku


W tym divie usuwasz treść i dajesz po prostu sam div z ustawionym identyfikatorem, treść ustawi CSS.
trifek
Też nad tym myślałem, tylko nie wydaje mi się to za dobrym rozwiązaniem (np. jak zdjęcie będzie ciut mniejsze/większe) - to, to liczenie nie będzie do końca dobre sad.gif
Poza tym, łamanie tekstu po ilości znaków może uciąć wyraz w połowie sad.gif
Niree
Rozmiar zdjęcia możesz ograniczyć min-width i max-width.

Ja tylko zasugerowałem jedno z rozwiązań, nikt Ci nie każe łamać tekstu w połowie tongue.gif W google masz pełno skryptów na łamanie stringa bez rozdzielania wyrazu.
http://stackoverflow.com/questions/1233290...not-a-character
trifek
dziękuję bardzo za pomoc smile.gif)

a gdybym na stronie miał zamiast 2 - np. 3 takie "boxów" tekstowych to jak by to wyglądało?



W czym jest lepsze/gorsze Twoje rozwiązanie od "wkładania" tekstu bezpośrednio w DIV?smile.gif

Niree
Ilość divów nie ma znaczenia. I tak mają określony limit wyrazów/znaków i musisz to wziąć pod uwagę pisząc warunek.

Generalnie można wrzucić tekst bezpośrednio do diva, ale jeżeli mówimy o responsywności, no to później możesz cudować od razu w tym CSS z @media itp., zmniejszać czcionkę, ustawiać szerokość i inne cuda.
To jest wersja lo-fi głównej zawartości. Aby zobaczyć pełną wersję z większą zawartością, obrazkami i formatowaniem proszę kliknij tutaj.
Invision Power Board © 2001-2024 Invision Power Services, Inc.