Faq how to?

http://expfaq.1go.dk/

Den ser ok ud, men hvordan laves denne?
jeg kan specielt godt lide det med når man trykker på et punkt, så bliver det stykke, der hører under det valgte, markeret. Hvordan laves dette?

Et andet eksempel: http://www.jensgram.dk/faq.php (kilde: http://www.jensgram.dk/source.php?fil=%2Ffaq.php&printerrar=jotaksombyder)

Hej jens. Det ser også fint ud, men kan faktisk rigtig godt lide den JakobClausen har linket til..
Men ved ikke hvordan denne laves...

mr-bob >> jeg har prøvet at kigge lidt i koden og kan faktisk ikke helt finde ud af hvordan det er lavet - men ja, det er nemlig ret smart.

ok. ved du hvem der har lavet det? kan nemmerlig ikke finde nogen oplysninger på det.

well jeg sætter mig også lige ned og kigger i koden, må lige se om jeg kan hitte ud af den...

Jeg mener det er "exp", der har lavet det - han har i hvertfald haft noget med det at gøre: http://www.eksperten.dk/bruger.phtml?navn=exp

Det er korrekt at det er mig der har kodet den :-)

Og det er faktisk meget simpelt.

Hvis vi tager udgangspunkt i et tilfældigt punkt i FAQ'en, fx:
http://expfaq.1go.dk/?id=3#behandling_af_svar

ses to dele.
1. ID = 3
2. Der henvises til "behandling_af_svar"

Nu til markeringstricket:
Hver gang siden loades, indlæses samtlige punkter fra databasen (Yes, de ligger i en database), og listes op i en parent/child-system. Hver hovedpunkt sit ID, hver underpunkt sit ID.

I det øjeblik ID'et fra adresselinien er lig med det ID der hentes ud fra databasen, tilføjes en anden klasse til den pågældende <div>, således at formateringen er anderledes - blå baggrund og markeret kant.

Herefter fortsættes udskrivningen af punkter på normal vis.

Når siden er færdig med at indlæse, springes til den pågældende <a name> (som også sættes individuelt fra databasen.

Slut prut :-)

exp >> Kunne du lave et lille eksempel, hvor vi kan få lov at se koden? HVis det er tilladt vil jeg godt give 200 point for det :-)

Kan da prøve, uden at røbe hele kildekoden ;-)

//Pseudokode
Hent alle poster i databasen

Udskriv alle poster i databasen // $rs[]

while($rs) { // Hvis $rs['id'] = $_GET['id'] sættes $selected='selected', hvis ikke: $selected='qa'
    if (isset($_GET['id']) && $_GET['id'] == $rs['id']) {
        $selected = 'selected';
        $br = '<br />';
    } else {
        $selected = 'qa';
    }
    echo "<div class='".$selected."'><h3><a href='?id=".$rs2['id']."#".$rs2['hotlink']."'>".$rs2['titel']."</a></h3>\r\n";
    $str = nl2br(stripslashes($rs2['tekst']));
    echo $str."</div>\r\n\r\n".$br;
    $selected = 'qa'; //Bare lige for at sikre mig, at $selected='qa', så den ikke pludselig markerer flere felter (resultatet af sjusket rodekode)
}

Css:
.selected {
    background: silver;
    border: 2px solid black;
    }
.qa {
    background: white;
    border: 0px;
    }


Sådan cirka :-)

Hej exp. tak fordi du lige ville kigge forbi.

Hmm, det ovenstående forstår jeg ikke en disse af... troede ikke det var så indviklet. Havde håbet jeg kunne overleve med lidt copy/paste.. ;-)

Men takker da fordi du lige begav dig herind..

Mvh Bob

... hvis du ikke har mod på serverside-scripting, så _kan_ fremhævningen altså også laves i DHTML:

* Hvert spm i en unikt navngiven container
* en onclick-event-ting på spørgsmålet (sikkert et anker)
* en lille funktion (JavaScript), der sætter en baggrundsfarve på elementet (via. document.getElementById(<mit_element>).style.backgroundColor)
* ovenstående funktion kan evt. indeholde et array over alle spm-containers, hvilket gør det let at "afmarkere" alle andre spm...

Håber du forstod!

Altså jeg må da ærligt indrømme at jeg ikke forstår særlig meget af den ovenstående kode....

Jensgram: er det sådan at jeg kan få dig til at lave et eksempel på det?

Ja, det kan du da!

Dine FAQ's

<div id="faq1">
    <p><a href="java script:fremhaev(1);">Hvordan spiser man ild?</a></p>
    <p>Det er bare noget man kan!</p>
</div>

<div id="faq2">
    <p><a href="java script:fremhaev(2);">Hvordan spiser man ræve?</a></p>
    <p>Det er bare noget man skal lade være med!</p>
</div>


Scriptet:

function fremhaev(q) {
    cnt = 2; // Vi har p.t. 2 spørgsmål (faq1 og faq2) - den lettest måde

    for (i = 1; i <= cnt; i++) {
        if (i == q) {
            c = 'red';
        } else {
            c = 'white';
        }
        document.getElementById('faq' + q).style.backgroundColor = c;
    }
}

Det er absolut utestet, men burde virke. Flere ting kunne laves mere elegant, men idéen er god nok (vil jeg hævde).

"cnt" har jeg medtaget, da du så blot kan ændre den, når du indsætter et nyt spm. Forudsat slf, at du navngiver dem "faq1", "faq2", ... "faqN", så der er 1, 2, ... N  spm.

"c" er den baggrundsfarve som markerede spm vil få (rød) og den til alle andre (hvis) for at kunne nulstille andre (som evt. kan være valgt fra tidligere), når der vælges et spm. Du kan slf også benytte "#rrggbb"- og "rgb(r, g, b)"-syntaks

Tusind tak. det vil jeg lige kigge på. Skal nok komme tilbage og give point..

bob

Jens smider du ikke også lige et svar?

Joda, hvis det kunne bruges

alt kan bruges....

Takker for hjælpen alle sammen..

Mvh Bob

Takker for point!