[Løst]Rullgardin-content i Ajax/JS

[Ellingsen]

Hei!

 

jeg har akkuratt laget meg en blogg. Der har jeg en kommentarfunksjon som jeg gjerne skulle hatt litt hjelp til og gjøre perfekt. Jeg vil gjerne ha en funksjon som de har på facebook, nåt man trykker på "vis alle kommentarer" eller hva det står. Man viser 2-3 kommentarer, også hvis man trykker på "vis alle" så blir den større og "dytter" resten av contentet nedover på siden..

 

Håper noen skjønner hva jeg mener, og har en løsning/tutorial liggende.

 

På forhånd takk.

[luxus]

Her kommer en løsning, jQuery er benyttet. Den er dog ganske enkel, og fungerer med å sjule/vise elementer som alt ligger i DOM. Det som kanskje er bedre, hvis du ønsker å optimalisere databasekall med en LIMIT på kommentarene dine, må være å gjøre uthentig av kommentarer som ikke blir vist opprinnelig via et ajax-kall til server.

 

$(function() {
 // Vi har nå fått hentet ned jQuery og DOM er ready
 // Henter alle a-tags av klasse vis_flere, og hekter på en click funksjon
 $("a.vis_flere").click(function(e) {
 e.preventDefault(); // Forhindrer browseren i å prøve å gå til URL med #-tagen bak.
 $(this).html($(this).html() == "Vis flere" ? "Sjul" : "Vis flere") // Ender på HTML-en inne i a-tagen
 .next("div.flere_kommentarer") // Går til neste node i DOM som er en div med klasse flere_kommentarer
 .slideToggle(); // Kjører animasjon slide på denne.
});

 

Se forøvrig vedlegg for fullt HTML-eksempel! :-)

vis_mer.html

[Ellingsen]

Dæven. Takk skal du ha!