Pomoc - Szukaj - Użytkownicy - Kalendarz
Pełna wersja: [HTML]Cały div na linka
Forum PHP.pl > Forum > Przedszkole
michat34
Witam mam takie cos:
[SMARTY] pobierz, plaintext
  1. {section name=i loop=$news}
  2. <div class="news">
  3. {$news[i].title} ({$news[i].add_timestamp})<br>
  4. {$news[i].description|truncate:200:"..."}<br>
  5. Dodany przez <a href="index.php?action=2&user_id={$news[i].author_id}">{$news[i].login}</a> ({$news[i].replies} odpowiedzi)
  6. </div>
[SMARTY] pobierz, plaintext

kazde ogloszenie to nowy div o szerokosci 1000px i nieustalonej wysokosci (zalezy od dlugosci desciption). Teraz chcialbym aby po kliknieciu diva przenosilo mnie do szczegolowego opisu newsa (pelen description, mozliwosc komentowania itd). jak to zrobic? myslalem nad:
[SMARTY] pobierz, plaintext
  1. {section name=i loop=$news}
  2. <a href="index.php?news_id={$news[i].news_id}">
  3. <div class="news">
  4. {$news[i].title} ({$news[i].add_timestamp})<br>
  5. {$news[i].description|truncate:200:"..."}<br>
  6. Dodany przez <a href="index.php?action=2&user_id={$news[i].author_id}">{$news[i].login}</a> ({$news[i].replies} odpowiedzi)
  7. </div>
  8. </a>
[SMARTY] pobierz, plaintext

ale to mi robi tak, ze tekst w divie jest klikalny a nie cały div. Jak zrobic zeby caly div byl linkiem? Robienie klasy linka o okreslonych wymiarach nie zda egzamnu bo nie znam wysokosci wiec prosze o inne propozycje
vifus
  1. #link a {
  2. width: 100px;
  3. height: auto;
  4. }



  1. {section name=i loop=$news}
  2. <div id="link"><a href="">
  3. <div class="news">
  4. {$news[i].title} ({$news[i].add_timestamp})<br>
  5. {$news[i].description|truncate:200:"..."}<br>
  6. Dodany przez <a href="index.php?action=2&user_id={$news[i].author_id}">{$news[i].login}</a> ({$news[i].replies} odpowiedzi)
  7. </div>
  8. </a>
  9. {/section}
  10. </a></div>
Adis92
vifus w twoim poście zagnieżdżają się dwa linki w sobie!
vifus
Fakt, nie zauważyłem..
Adis92
  1. {section name=i loop=$news}
  2. <div class="news" onClick="location.href='index.php?news_id={$news[i].news_id}'">
  3. {$news[i].title} ({$news[i].add_timestamp})<br>
  4. {$news[i].description|truncate:200:"..."}<br>
  5. Dodany przez <a href="index.php?action=2&user_id={$news[i].author_id}">{$news[i].login}</a> ({$news[i].replies} odpowiedzi)
  6. </div>
  7. {/section}
michat34
Wolałbym nie robic tego w JS. Narazie zastosowalem rozwiazanei kolegi ale wole to rozwiazac w CSS. Sposob vifusa nie dziala ktos ma jeszcze jakies pomysly? Nie wierze ze nie da sie tego elegenako rozwiazac w css...
thurinon
Daj linkowi w tym divie display:block, a divowi odpowiedni rozmiar. Ale musisz się pozbyć podlinkowania w miejscu gdzie wyświetlasz autora, bo masz link zagnieżdżony w linku.
Adis92
Ale autor posta napisał że wielkość jest nieznajoma więc nie da.
michat34
tak wysokosci nie znam. no nie wierze ze w wersji 3 css'a nie ma dobrego sposobu na takie cos...
thurinon
Kod
.news {width: 1000px; }
a {display: block;}


Kod
{section name=i loop=$news}
    <a href="index.php?news_id={$news[i].news_id}">
                    <div class="news">
                        {$news[i].title} ({$news[i].add_timestamp})<br>
                        {$news[i].description|truncate:200:"..."}<br>
                        Dodany przez <a href="index.php?action=2&user_id={$news[i].author_id}">{$news[i].login}</a> ({$news[i].replies} odpowiedzi)
                    </div>
      </a>
{/section}


To po prostu działa przynajmniej teraz u mnie na localu i chromie

Tylko popraw tego baboka z <a>cośtam<a>autor</a>cośtam</a>
na <a>cośtam</a><a>autor</a>cośtam
Adis92
Thurinon w Twoim sposobie zagnieżdżają się dwa linki.
Sprawdziłem i u mnie działa
  1. div.news{
  2. width: 500px;
  3. border: 1px solid #000;
  4. position: absolute;
  5. display: block;
  6. overflow: hidden;}
  7.  
  8. div.news > a{
  9. z-index: 5;
  10. position: absolute;}
  11.  
  12. div.news > a.link{
  13. width: 100%;
  14. position: absolute;
  15. display: inline-block;
  16. height: 100%;
  17. top: 0;
  18. left: 0;
  19. bootom: 0;
  20. right: 0;}

  1. <div class="news">
  2. <a href="index.php?news_id={$news[i].news_id}" class="link"></a>
  3. <p>
  4. {$news[i].title} ({$news[i].add_timestamp})<br>
  5. {$news[i].description|truncate:200:"..."}<br>
  6. Dodany przez <a href="index.php?action=2&user_id={$news[i].author_id}" class="reszta">{$news[i].login}</a> <br/>
  7. ({$news[i].replies} odpowiedzi)</p>
  8. </div>
thurinon
Adi wiem, że zostawiłem zagnieżdżony, i napisałem o tym smile.gif mimo to działa, a że miałem zły humor to nie wysilałem się smile.gif. JA po prostu poszedł bym na łatwiznę i nie linkował bym autora.
Twój sposób jest bardzo sprytny - gdybym mógł kliknął bym "Pomógł" ;-]
Pawel_W
z-index działa też dla position: relative, używanie tutaj position absolute dla wszystkich elementów nie jest dobrym wyjściem wink.gif
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-2025 Invision Power Services, Inc.