Witaj Gościu! ( Zaloguj | Rejestruj )

Forum PHP.pl

> [JavaScript][HTML][CSS] overflow:hidden przy danym height, coś w stylu overflow:hidden, ale bez przycinania ostatniej linijki
kto$
post 29.02.2012, 22:29:43
Post #1





Grupa: Zarejestrowani
Postów: 33
Pomógł: 1
Dołączył: 9.05.2010

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


Borykam się z następującym problemem. Mam diva, który jest wypełniany przez zapytanie bazodanowe tekstem. Niekiedy wysokość tego diva sięga ok 800px.
Zrobiłem więc prosty system w jQuery show/hide, który wyświetla pierwsze 300px wysokości diva i po kliknięciu na "więcej" div zmienia wysokość na auto/100%.
Wszystko działa jak należy, jednak klientowi nie podoba się rozwiązanie z overflow:hidden, bo przycina u niego ostatnią linijkę przed rozsunięciem reszty tekstu.

Czy jest jakieś rozwiązanie, o którym jeszcze nie wiem, które jest w stanie określić wysokość/ wybrać wysokość <= 300px, tak żeby te linijki wierszy nie były przycięte jak przy overflow:hidden? Domyślam się, że to też przez jQuery, ale w tej tematyce jeszcze raczej raczkuję, więc proszę o rady które mogłyby mnie naprowadzić na rozwiązanie.

Dzięki za rady
Go to the top of the page
+Quote Post
 
Start new topic
Odpowiedzi (1 - 3)
prowseed
post 1.03.2012, 00:07:19
Post #2





Grupa: Zarejestrowani
Postów: 433
Pomógł: 64
Dołączył: 29.01.2011
Skąd: Warszawa

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


  1. <p>tutaj krotki tekst</p>
  2. <p class="toggle">tutaj reszta</p>
  3. <div class="toggleplaceholder"></div>


  1. $('.toggle').next().append('<a href="#" class="button">Pokaż / ukryj</a>');
  2. $('.toggle').hide();
  3. $('a.button').click(function() {
  4. $(this).parent().prev('.toggle').toggle('slow');
  5. return false;
  6. });


to tak najproście. Tekst sobie możesz dzielić w php albo od razu wprowadzac do bazy jako zalążek i reszta.


--------------------
Go to the top of the page
+Quote Post
kto$
post 1.03.2012, 14:35:17
Post #3





Grupa: Zarejestrowani
Postów: 33
Pomógł: 1
Dołączył: 9.05.2010

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


Cytat(prowseed @ 1.03.2012, 00:07:19 ) *
to tak najproście. Tekst sobie możesz dzielić w php albo od razu wprowadzac do bazy jako zalążek i reszta.



Też tak na początku myślałem, ale jest pewne ale. Oczywiście mogę ustawić, że pobiera 496 znaków ciągu i wstawia go do pierwszego diva, a resztę pakuje do tego chowanego przez toogle. Problemem jest to, że ten tekst jest generowany przez klienta w ckeditor, gdzie wszystkie znaczniki (<p>, <br />, <strong> etc.) są przekazywane w tym ciągu znaków. Dlatego to rozwiązanie, które zaproponowałeś wyżej nie sprawdzi się za bardzo.
Sam to zrobiłem przez animate, tylko właśnie chodzi o to, żeby określić wysokość zbieżną do 300 px, tak żeby tekst nie był poprzycinany, jak to mamy przy overflow:hidden.

Pozdrawiam
Go to the top of the page
+Quote Post
prowseed
post 1.03.2012, 18:52:00
Post #4





Grupa: Zarejestrowani
Postów: 433
Pomógł: 64
Dołączył: 29.01.2011
Skąd: Warszawa

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


no to ustaw sobie line-height w css na jakas stala, na przyklad 16px, a pozniej jesli chcesz sobie zostawic 4 linijki to 16px•4 [64px], jesli 8 linijek to 16px•8 [128px]


--------------------
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: 14.08.2025 - 03:25