FAQ interessanter gestalten!
Business-Template / IE 11/ FAQ interessanter gestalten!
Habe mich zur Zeit mit der Forum-Hilfe beschäftig und so einiges verändert:
1. Mehrere Kategorien (3): Grundlagen, Foren-Codes, Impressum
2. Start FAQ: Kategorien sind geschlossen
3. Klick auf Frage-Link, Titelleiste und Titelbeschreibung: Sprung zum Seiteanfang
4. Antworten: Verwendung von Überschriften, Aufzählungen, Links und mehreren Absätzen
5. Nutzungsbedingungen: Auf linke, geschlossene Seite verschoben
6. Weil die Suche bei bestimmten HTML-Tags durcheinander kommt: Minimierung von "class" und "style"
Habe da zwei F r a g e:
1. Weil die Kategorie "Grundlagen" schon recht groß ist, würde ich beim Öffnen einer neuen Kategorie die zuvor geöffnete Kategorie wieder schließen wollen!
2. Beim Öffnen einer neuen Kategorie, sollte die erste Frage geöffnet werden!
Wie geht das, bekomme es leider nicht hin.
Wer kann mir hier helfen?
PS: Wenn alles fertig ist, wollte ich einen kleinen Forum-Beitrag mit den Änderungen schreiben!
Meine z.Z. geänderte Forum-Hilfe: FAQ
Support: Fehler in der FAQ-Suche
Schon mal besten Dank im Voraus!
Gruß
Wolfgang
Am einfachsten wäre es, wenn du direkt die Javascript-Funktion anpasst, die die Untermenüs ein- und ausblendet.
Beachte das $('.vi').hide(); in folgendem Code:
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
$('#help-ul li').click(function(event) {
if($(this).hasClass('group')) {
if($(this).hasClass('group-active'))
{ event.preventDefault();
$(this).removeClass('group-active');
$(this).find('ul').css('display', 'none'); }
else { $(this).addClass('group-active');
$('.vi').hide();
$(this).find('ul').css('display', 'block'); }
} else {
if($(this).hasClass('topic-active')) { }
else { $('#help-ul li').removeClass('topic-active'); $(this).addClass('topic-active'); }
var helpcontent = $(this).find('div').html();
$('#help-right').empty();
$('#help-right').html(helpcontent);
}
return false;
});
PS: Wenn ich deine FAQ öffne habe ich dort diverse Javascript-Fehler in der Console (document.getElementById is null). Das soltlest du dir mal anschauen...
Technik · #3 RE: FAQ interessanter gestalten!
Wow,
mit .vi (.vistit) funktioniert das gegenseitige Auslösen! 
Aber, das Vorzeichen ändert sich nicht...
Um die Kategorie zu öffnen muss man dann 2 mal klicken (1. Klick: - wird zu plus / 2. Klick: Kategorie öffnet sich)
Siehe Bild:
Gibt es hier noch eine schnelle Lösung?
Mit besten Dank
Gruß
Wolfgang
Ungetestet, aber das sollte eigentlich klappen:
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
$('#help-ul li').click(function(event) {
if($(this).hasClass('group')) {
if($(this).hasClass('group-active'))
{ event.preventDefault();
$(this).removeClass('group-active');
$(this).find('ul').css('display', 'none'); }
else {
$.each($('.vi'),function(){
$(this).hide();
$(this).prev().removeClass('group-active');
});
$(this).addClass('group-active');
$(this).find('ul').css('display', 'block'); }
} else {
if($(this).hasClass('topic-active')) { }
else { $('#help-ul li').removeClass('topic-active'); $(this).addClass('topic-active'); }
var helpcontent = $(this).find('div').html();
$('#help-right').empty();
$('#help-right').html(helpcontent);
}
return false;
});
Hallo Ingmar.
2
3
4
$.each($('.vi'),function(){
$(this).hide();
$(this).prev().removeClass('group-active');
});
So wie es aussieht, hat Zeile 3 keine Auswirkung.
Das Grafik-Vorzeichen bleibt beharrlich unverändert.
Habe es zu Sicherheit auch im unveränderten Template ausprobiert.....
Kann ich noch etwas machen? 
Besten Dank im Voraus
Gruß
Wolfgang
Naja du hast ja auch ganz andere Klassennamen, da kann das so nicht klappen.
Probier's mal mit
2
3
4
$.each($('.vi'),function(){
$(this).hide();
$(this).closest('li').removeClass('ga');
});
#7 RE: FAQ interessanter gestalten!
Wow, es funktioniert!
7 von 6 Sterne!
Wenn man das FAQ ausbaut und mehrere Kategorien anlegt,
ist es jetzt wirklich perfekt!
Schön ist auch, dass die Suche von dieser Änderung nicht beeinflusst wird!
Bis dann und besten Dank für die Geduld und Hilfe, für die "Hilfe".
PS: Muss noch über die Lösung nachdenken. 
Gruß
Wolfgang
Zitat von Wolfgang im Beitrag #7
PS: Muss noch über die Lösung nachdenken. [mm]
2
3
4
5
6
$.each($('.vi'),function(){
$(this).hide();
$(this).closest('li').removeClass('ga');
});
Kurze Erklärung dazu:
Der Code oben sucht alle Elemente mit der Klasse .vi und blendet sie aus ($(this).hide();)
Die Zeile $(this).closest('li').removeClass('ga'); sucht zu jedem diese .vi-Elemente das jeweils nächste li-Element und entfernt dort die Klasse "ga" (dadurch stimmt dann wieder das Icon)
Man könnte das zur Vereinfachung in eine Funktion packen, die man alleUntermenuesSchliessen nennt:
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
function alleUntermenuesSchliessen (){
$.each($('.vi'),function(){
$(this).hide();
$(this).closest('li').removeClass('ga');
});
}
$('#help-ul li').click(function(event) {
if($(this).hasClass('group')) {
if($(this).hasClass('group-active'))
{ event.preventDefault();
$(this).removeClass('group-active');
$(this).find('ul').css('display', 'none'); }
else {
alleUntermenuesSchliessen ();
$(this).addClass('group-active');
$(this).find('ul').css('display', 'block'); }
} else {
if($(this).hasClass('topic-active')) { }
else { $('#help-ul li').removeClass('topic-active'); $(this).addClass('topic-active'); }
var helpcontent = $(this).find('div').html();
$('#help-right').empty();
$('#help-right').html(helpcontent);
}
return false;
});
Ähnliche Themen
Jetzt anmelden!
Jetzt registrieren!