 |
| | LinkBack | Themen-Optionen | Thema durchsuchen |
30.01.2009, 08:41
| Nach oben #1 |
| Jann Hendrik Bekaan Registriert seit: 02.12.2004 Ort: Wildeshausen
Beiträge: 3.198
|  aufklappbare Liste (mit CSS, ohne JS) kompatibel mit allen Browsern
Ich würde gerne eine JS-freie Liste mit links erstellen, die sich entsprechend dem link, der angeklickt wurde, öffnet. Also bspw. folgende 10 links: linka linkb linkc linkd linke linkf linkg linkh linki linkj Wenn nun auf linkf geklickt wird, dann: linka linkb linkc linkd linke linkf Und hier kommt nun ein versteckter Text zum Vorschein, der vorher via CSS verborgen war und den man nun in aller Ruhe lesen kann. linkg linkh linki linkj Entsprechend natürlich auch für die anderen links. wenn nun einer der anderen links angeklickt wird sollte der dazu gehörige Text eingeblendet werden... Kann man sowas via CSS so realisieren, dass das auch in allen Browsern funktioniert? Ich hoffe das verständlich ausgedrückt zu haben - wenn nicht, einfach nachfragen....
__________________ Umfragen:  bitte beachten: Vorschläge für künftige Umfragen Woher weißt du vom developers-guide?Wenn du dich in ein interessantes Thema eingearbeitet hast, dann lass andere daran teilhaben! Schreibe ein Tutorial und beschreibe, wie es geht, was nicht klappt, wo man aufpassen muss usw.Danke! |
|     |
|
30.01.2009, 09:08
| Nach oben #2 | ||
| Erfahrener Benutzer Registriert seit: 31.12.2006 Ort: Zürich
Beiträge: 397
|
Hm... Also wenn wir das Zitat:
Zitat:
__________________ . <-- This is Punkt. Copy Punkt into your signature to help him on his way to world domination. | ||
|
| |
|
30.01.2009, 09:33
| Nach oben #3 |
| Jann Hendrik Bekaan Registriert seit: 02.12.2004 Ort: Wildeshausen
Beiträge: 3.198
|
Es muss auch nichtzwangsweise auf diese Art gelöst werden... Es soll für eine FAQ werden. Man sieht erst eine Reihe Fragen (links), und die Antworten erscheinen, wenn man auf die jeweilige Frage (den jeweiligen link) klickt. Ggf. wäre das ja anders besser gelöst, aber die Idee gefällt mir ansich schon..
__________________ Umfragen: bitte beachten: Vorschläge für künftige Umfragen Woher weißt du vom developers-guide?Wenn du dich in ein interessantes Thema eingearbeitet hast, dann lass andere daran teilhaben! Schreibe ein Tutorial und beschreibe, wie es geht, was nicht klappt, wo man aufpassen muss usw.Danke! |
|
| |
|
30.01.2009, 10:18
| Nach oben #4 |
| Bastian Fenske Registriert seit: 04.01.2006 Ort: Kassel
Beiträge: 964
|
Hi Jann Hendrik. Ich würde hier einfach alle Antworten sichtbar lassen und mit JS verstecken und damit eben auch das jeweilige Ein- und Ausblenden umsetzen. Damit hast du zwar für alle No-JS-Besucher eine riesige Seite - aber sie ist benutzbar. Mit jQuery sähe das etwa so aus: Code: $(document).ready(function(){
$('.answer').hide();
$('.question').click(function() {
$('.answer').slideUp();
$(this).next().slideDown();
});
});
Dazu müssten alle Fragen class="question" und alle Antworten class="answer" bekommen und das jeweilige Antwort-Element (HTML) müsste direkt auf das Frage-Element folgen (das next() greift auf das folgende Geschwister-Element zu). Bastian |
|
| |
|
30.01.2009, 20:26
| Nach oben #6 |
| Jann Hendrik Bekaan Registriert seit: 02.12.2004 Ort: Wildeshausen
Beiträge: 3.198
|
okay, das wäre eine Alternative... Ich muss mal schauen, ob ich das umsetzen kann - ich bin absoluter JS-Neuling :)
__________________ Umfragen: bitte beachten: Vorschläge für künftige Umfragen Woher weißt du vom developers-guide?Wenn du dich in ein interessantes Thema eingearbeitet hast, dann lass andere daran teilhaben! Schreibe ein Tutorial und beschreibe, wie es geht, was nicht klappt, wo man aufpassen muss usw.Danke! |
|
| |
|
31.01.2009, 00:25
| Nach oben #7 |
| Wikinger Registriert seit: 02.03.2006 Ort: Aachen
Beiträge: 298
|
Da kann ich dir wie Basti schon sagte auch jQuery empfehlen. Das macht JS so unheimlich elegant und einfach.
__________________ Why Software Sucks! Latest Blog Article: Windows Installer User Experience "Paulaner ist erfolgreicher als Al Quaida" - Volker Pispers |
|
| |
|
18.03.2009, 21:28
| Nach oben #8 |
| Jann Hendrik Bekaan Registriert seit: 02.12.2004 Ort: Wildeshausen
Beiträge: 3.198
|
Ich habe den thread mal in die JS-Ecke geschoben, weil ich die Lösung dann letztlich doch so machen werde, dass der JS-freie Nutzer alles aufgeklappt sieht. Der JS-Nutzer alles eingeklappt haben soll und einzeln nach Bedarf aufklappen kann. Derzeit sieht das dann so aus: http://www.developers-guide.net/faq/ Ansich wäre ich schon fast zufrieden. Für JS-deaktivierte user ist die Liste komplett (ausgeklappt) sichtbar. Für JS-user allerdings anfänglich auch. Wäre es möglich das noch zu ändern?
__________________ Umfragen: bitte beachten: Vorschläge für künftige Umfragen Woher weißt du vom developers-guide?Wenn du dich in ein interessantes Thema eingearbeitet hast, dann lass andere daran teilhaben! Schreibe ein Tutorial und beschreibe, wie es geht, was nicht klappt, wo man aufpassen muss usw.Danke! |
|
| |
|
19.03.2009, 08:13
| Nach oben #9 |
| Jann Hendrik Bekaan Registriert seit: 02.12.2004 Ort: Wildeshausen
Beiträge: 3.198
|
Ich habe hier eine noch elegantere Umsetzung gesehen, die eine JS-Datei aus dem vBulletin einbindet, die die entsprechende Funktion beinhaltet. Ich habe allerdings anstelle eine <a> ein <span> genommen, weil es andernfalls einen link erzeugt, der für nicht-JS-user einen Fehler verursacht. Mein Problem im Moment ist: entweder ist für beide (mit aktiviertem und deaktiertem JS) user-Gruppen der klappbare Teil ausgeblendet, oder eingeblendet. Schön wäre, wenn: - mit JS sind die Antworten versteckt und können eingeblendet werden - ohne JS sind sie schon vorhanden (funktioniert) Was halt noch fehlt, ist das Ausblenden der Antworten bei aktiviertem JS. Hat dazu jmd. eine Idee? Achja.. .schön wäre natürlich, wenn das Bildchen  sich dabei noch zu einem  ändern würde. Das Bild habe ich derzeit dort nicht eingebaut. Die Funktion sieht man aber auf der Foren-Startseite, um Foren ein- und ausblenden zu können.
__________________ Umfragen: bitte beachten: Vorschläge für künftige Umfragen Woher weißt du vom developers-guide?Wenn du dich in ein interessantes Thema eingearbeitet hast, dann lass andere daran teilhaben! Schreibe ein Tutorial und beschreibe, wie es geht, was nicht klappt, wo man aufpassen muss usw.Danke! |
|
| |
|
19.03.2009, 09:13
| Nach oben #11 |
| Jann Hendrik Bekaan Registriert seit: 02.12.2004 Ort: Wildeshausen
Beiträge: 3.198
|
Okay, aber wenn ich die Funktion so aufbaue, dass die ganzen google-Funktionen nacheinander aufgerufen werden, dann .. wird nur die erste berücksichtigt. Beispiel: http://www.bekaan.net/js-test/index4.html Code: <head>
//...
<script type="text/javascript">
function hideFAQ()
{
toggle_collapse('faq2');
toggle_collapse('faq1');
toggle_collapse('faq3');
toggle_collapse('faq4');
toggle_collapse('faq5');
toggle_collapse('faq6');
toggle_collapse('faq7');
}
</script>
</head>
//...
__________________ Umfragen: bitte beachten: Vorschläge für künftige Umfragen Woher weißt du vom developers-guide?Wenn du dich in ein interessantes Thema eingearbeitet hast, dann lass andere daran teilhaben! Schreibe ein Tutorial und beschreibe, wie es geht, was nicht klappt, wo man aufpassen muss usw.Danke! |
|
| |
|
19.03.2009, 10:16
| Nach oben #13 |
| Jann Hendrik Bekaan Registriert seit: 02.12.2004 Ort: Wildeshausen
Beiträge: 3.198
|
mmh... ohne JS funktioniert es schon, aber mit JS ist bei mir nur der zweite (also der erste Funktionsaufruf in der hideFAQ) ausgeblendet. getestet im Opera, IE und FF
__________________ Umfragen: bitte beachten: Vorschläge für künftige Umfragen Woher weißt du vom developers-guide?Wenn du dich in ein interessantes Thema eingearbeitet hast, dann lass andere daran teilhaben! Schreibe ein Tutorial und beschreibe, wie es geht, was nicht klappt, wo man aufpassen muss usw.Danke! |
|
| |
|
| Lesezeichen |
| Aktive Benutzer in diesem Thema: 1 (Registrierte Benutzer: 0, Gäste: 1) | |
| Themen-Optionen | Thema durchsuchen |
| |
Alle Zeitangaben in WEZ +1. Es ist jetzt 06:55 Uhr.
