V6: Keine "Active-Anzeige" und "Mouseover" in der oberen Navileiste

11.09.2020 10:44
#1 V6: Keine "Active-Anzeige" und "Mouseover" in der oberen Navileiste
avatar
Mitglied

In den V6-Template "Zeitlos Blau", "HPM Business" und "X6" gibt es in der oberen Navigation keine farbliche Änderung, um zu sehen in welcher Kategorie man sich aufhält!
In den anderen V6-Template wird es angezeigt! Super!

Vorab-Lösung:

So sieht es nach dem Eintrag aus!

Interessanterweise war es mir nicht möglich über die CSS/SCSS eine Veränderung zu bewirken.....
Auch musste ich aufpassen, dass nur die Navileiste verändert wird!
Habe es über einen Skript-Eintrag in "Admin > Layout > Farben & Einstellungen > Eigenes HMTL/JS > Eigenes Javascript" hinbekommen.
Vielleicht etwas umständlich, aber für ein Vorab-Lösung geht es !

  • Das Skript, verändert sogar beim Mouseover die Linkfarbe in ein leichtes Grau, aber nur bei inaktiven Links (Zeile 3).
  • In Zeile 10 wird der Hintergrund bei aktiver Kategorie bestimmt!
  • Funktioniert in den V6-Templates "Zeitlos Blau", "HPM Business" und "X6"!

1
2
3
4
5
6
7
8
9
10
11
 
<script>
$(".navbar-nav .nav-link").hover(function(){
$(this).css("color", "#dadada");
$('div.navbar-nav .nav-link.active, .nav-pills .show > .nav-link').css({'color':'#222222'});
}, function(){
$(this).css("color", "#fafafa");
$('div.navbar-nav .nav-link.active, .nav-pills .show > .nav-link').css({'color':'#222222'});
});
 
$('div.navbar-nav .nav-link.active, .nav-pills .show > .nav-link').css({'background-color':'#fafafa','color':'#222222'});
</script>
 




Bis dann
Gruß
Wolfgang

12.09.2020 12:47 (zuletzt bearbeitet: 12.09.2020 13:14)
#2 RE: V6: Keine "Active-Anzeige" und "Mouseover" in der oberen Navileiste
avatar
Mitglied

Hallo zusammen,
da hatte ich wohl nicht genug getestet!

Und es geht doch!!!

Hier der super kleine Eintrag in "Admin > Layout > Farben & Einstellungen > CSS/SCSS":

  • Zeile 1 ist für die Linkfarbe beim Mouseover zuständig.
  • In Zeile 2 wird der Hintergrund bei aktiver Kategorie bestimmt!
  • Zeile 4 ist nur fürs "HPM-Business". Hier werden die Abrundungen im Navi herausgenommen (sieht hier besser aus!)

1
2
3
4
 
div.navbar-nav .nav-link:hover{color:#dadada;}
div.navbar-nav .nav-link.active {background-color:#fafafa;color:#222222;border-radius:0;}
/* Optional fürs HPM-Business */
/* div.navbar-nav .nav-link.active {border-radius:0;} */
 





Gruß
Wolfgang

21.09.2020 14:11
avatar  Ingmar
#3 RE: V6: Keine "Active-Anzeige" und "Mouseover" in der oberen Navileiste
avatar
Technik

Noch kurz zur Erklärung.

Um "aktive" Schaltflächen wie z.B. den aktuellen Menüpunkt zu kennzeichnen wird momentan die "Theme Farbe 1" als Hintergrundfarbe verwendet.

Ist diese aber (wie im X6, HPM Business und "zeitlos blau") mit der "Hintergrundfarbe der Kopf- und Fußzeile" identisch, sieht man auch keine farbliche Hervorhebung im Menü. Ich habe die Designvorlagen entsprechend angepasst.

Viele Grüße,
Ingmar


 Technik · Homepagemodules.de · Miranus GmbH

 Antworten

 Beitrag melden
Bereits Mitglied?
Jetzt anmelden!
Mitglied werden?
Jetzt registrieren!