Pomoc - Szukaj - Użytkownicy - Kalendarz
Pełna wersja: [jQuery] rozwijane newsy
Forum PHP.pl > Forum > XML, AJAX > AJAX
palonek
Witam!



Od kilku dni probuje zrobić rozwijane newsy na stronie. Jak to ma wyglądać? Ostatnio dodany news ładuje się w całości, 5 kolejnych posiada tylko tytuł, po kliknięciu tego tytułu, ostatnio dodany news ma się zwijać, a rozwijać ten w którego się klikneło. Jednak po kliknięciu ostatnio dodany się zwija, a rozwijają sie wszystie popostałe.

[JAVASCRIPT] pobierz, plaintext
  1. $(document).ready(function() {
  2.  
  3.  $(".newsCzytaj").click(function(){
  4.   $(".newsTresc").each(function() {
  5.   $(this).toggle(500);
  6.   });
  7.  });
  8. });
[JAVASCRIPT] pobierz, plaintext




[PHP] pobierz, plaintext
  1. $news_query = dbquery("SELECT * FROM news ORDER BY news_id DESC LIMIT 5");
  2.    
  3.    
  4.  if(dbrows($news_query)){
  5.   $i = 1;
  6.   while($news = dbarray($news_query)){  
  7.   if($i == 1){
  8.   echo("<div class=\"news_body\">");
  9.   echo( "<a href=\"#newsCzytaj\" class=\"newsCzytaj\"><h2>".$news['title']."</h2></a>" );
  10.   echo( "<div class=\"newsTresc\">".$news['tresc']."</div>" );
  11.   echo("</div>");
  12.   $i = 2;
  13.   } else {
  14.   echo("<div class=\"news_body\" >");
  15.   echo( "<a href=\"#newsCzytaj\" class=\"newsCzytaj\"><h2>".$news['title']."</h2></a>" );
  16.   echo( "<div style=\"display: none\" class=\"newsTresc\">".$news['tresc']."</div>" );
  17.   echo("</div>");
  18.   }
  19.   }
  20.  }
[PHP] pobierz, plaintext



jak zrobić aby każdy rozwijał się osobno?
seth-kk
niezbyt pomocna jest budowa htmla ale cos w stylu
  1. $('.newsCzytaj').click(function()
  2. {
  3. var obj = $(this).parent();
  4. $('.newsTresc', obj).show();
  5. obj.siblings('news_body').children('.newsTresc').hide();
  6. });

powinno zadzialac - nie testowane
palonek
no tak działa po części (fakt ze nie rozumiem za bardzo ale to inna sprawa biggrin.gif), każde otwiera się osobno tak jak chciałem, ale inne newsy się nie chowają i nie wiem jak to zrobić dalej biggrin.gif ale pomogl idzie do Ciebie winksmiley.jpg

EDIT:

Udało się, wielkie dzieki za kod ! po małych poprawkach działa tak jak chciałem biggrin.gif gdyby ktoś potrzebował, tutaj kod:

Kod
$(document).ready(function() {
    
    $(".newsCzytaj").click(function() {
        $(".newsTresc").slideUp(500);
        var obj = $(this).parent();
        $(".newsTresc", obj).toggle(500);
        obj.siblings("newsCzytaj").children(".newsTresc").toggle(500);
    });
});
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.