Forum - Aktive Links in der Fußleiste mit Hintergrundfarbe versehen oder ausblenden

Um alle Funktionen nutzen zu k�nnen, aktivieren Sie bitte JavaScript in ihrem Browser!

Der Treffpunkt f�r Hilfe, Tricks & Tipps � XOBOR-Foren und Homepages � Das neue Template Xobor (v6) � Aktive Links in der Fußleiste mit Hintergrundfarbe versehen oder ausblenden - Teil 1-2

Themen-Einstellungen

Thema drucken

Bereich wechseln

Start Willkommen! Ank�ndigungen & Termine, wichtige News! Stellen Sie Ihr eigene Webseite vor! Betriebssystem MS Windows & andere Betriebssysteme Betriebssystem MS Windows 11, 10, 8 und 7 - Tricks & Tipps MS Windows 11, 10, 8 und 7 - Fragen & Antworten Linux, Ubuntu und andere Betriebssysteme �rger mit dem PC, Laptop oder Tablet? �rger mit dem PC, Laptop oder Tablet - Vorbeugung und Hilfe �rger mit dem PC, Laptop oder Tablet - Fragen & Antworten Fragen zu DSL, VDSL, LTE und anderen Netzempfangsarten XOBOR-Foren und Homepages Alles f�r Ihr eigenes Forum oder Ihrer Webseite - Hilfe, Tricks & Tipps Alles f�r Ihr eigenes Forum oder Ihrer Webseite - Fragen & Antworten Das neue Template Xobor (v6) Energieerzeugung im neuen Zeitalter - Revolution�r! Videos und Webseiten zur Freien Energie Wasserstoff - Energietr�ger der Zukunft. Die besten Links Empfehlenswerte und interessante Links! Link - Suche Verschiedenes Faszinationen & Unglaubliches! Tricks & Tipps f�r Smartphones und iPhones Lob, Kritik & Verbesserungsvorschl�ge Spiel & Spa�, Witz & gute Laune! Spiritualit�t, Seele, New Age, Yoga, Gesundheit Alles, was noch so �brig bleibt Bannertausch Wie funktioniert der Bannertausch? Bannerrotation und Bannerwechsel

#1 | Aktive Links in der Fußleiste mit Hintergrundfarbe versehen oder ausblenden - Teil 1-2 datum

17.04.2023 19:39 (zuletzt bearbeitet: 18.04.2023 19:17)

Wolfgang

Administrator

Informationen anzeigen

Beitr�ge:	3447
Registriert seit:	10.12.2006
Blog:	Wolfgangs Blog

Homepage:	Nicht angegeben
Letzte Spende	Betrag � Forum Spende
Sternzeichen	Skorpion
Likes	1315

Aktive Links in der Fußleiste ausblenden - Teil 1

Fehler im Template (v6):

Das folgende Skript ist entstanden, weil ich ein Fehler in der Fußleiste gesucht habe.
Hatte es bereits dem Support gemeldet!
Hier war der FAQ-Link im Xobor (v6) Dark nicht zu sehen. Der FAQ-Link hat aktuell immer eine zweite Class "active" fest eingebunden!
Im Xobor (v6) Dark wird für "active" die Farbe schwarz gesetzt!
Dadurch ist der FAQ-Link nicht zu sehen, weil die Schriftfarbe und die Hintergrundfarbe gleich sind!

Frage:

Wie wäre es, wenn man den Link von der Seite, die man gerade aufgerufen hat ausblendet?
Auf mobilen Endgeräten, besonders auf dem Handy ein großer, optischer Vorteil, denke ich!
Die Fußleiste wird dadurch kürzer und übersichtlicher!

Was kann das Skript?

Der aktive Link wird ausgeblendet, die Fußleiste wird dadurch kürzer!
Das Ausblenden wird auch für den "Mitglieder-Link" und für den "Online-Link" im V4 aktiviert!
Das Skript funktioniert im Business (v4), im neuen Xobor (v6) & Mobil!

Installation fürs Business (v4), Xobor (v6) & Mobil

Das komplette Skript kann der Einfachheit wegen für das Template (v4) in die Kopf- oder Fußzeile, für das neue Xobor V6 & Mobil nach Eigenes Javascript kopiert werden.

Das Skript kann auch für das Business (v4), Xobor (v6) & Mobil als Plugin unter "Untere Leiste - Header" angelegt werden!
Wichtig! Im Plugin muss rechts oben das "Unterstützte Template" markiert werden, Business - Template (144) & Mobil - Template (177), Auswahl mit Mausklick oder Strg + Mausklick!

Über den Befehlszeile stehen jeweils die Beschreibungen!
Mobil werden die aktiven Links durch Zeile 38 ausgeblendet!
Optional kann durch Freigabe der Zeile 41 die aktiven Links im Xobor (v6) & Mobil ausgeblendet werden!
Optional kann durch Freigabe der Zeile 44 die aktiven Links im Business (v4) ausgeblendet werden!

1
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
34
35
36
37
38
39
40
41
42
43
44
45
46
47
 
<script>
window.addEventListener('load', function ( ) {
  // Bug V6 - "active" entfernen
  $('#footernav .nav-link.active').removeClass('active');
 
  // Seiten-Reload fürs Impressum
  $('#impressum_link').on('click', function() {
    location.href='/faq.php#impressum';
    location.reload();
  });
 
  if (document.location.href.indexOf('faq.php') > -1){
    if (document.location.href.indexOf('faq.php#impressum') === -1){
      // FAQ-Link aktiv setzen
      $('#faq_link').addClass('activ');
    } else {
      // Impressum-Link aktiv setzen
      $('#impressum_link').addClass('activ');
    };
  };
 
  // Mitglieder-Link aktiv setzen
  if (document.location.href.indexOf('userlist.php') > -1){
    $('#member_link').addClass('activ');
  };
 
  // Datenschutz-Link aktiv setzen
  if (document.location.href.indexOf('datenschutz.html') > -1){
    $('#privacy_link').addClass('activ');
  };
 
  // Extra fürs V4: User Online-Link aktiv setzen
  if (document.location.href.indexOf('useronline.php') > -1){
    $('#useronline_link').addClass('activ');
  };
 
 // Links ausblenden - Nur Mobil
      $('.mobileview #footernav .nav-link.activ').remove(); 
 
  // Links ausblenden - Nur Xobor (V6) & Mobil
     // $('#footernav .nav-link.activ').remove(); 
 
  // Links ausblenden - Nur Business (v4)
    // $('.footer .activ').remove();
 
});
</script>
 

Schlie�en

Spoiler mit einem Klick öffnen und schließen!

Wolfgang

Antworten

#2 | Aktive Links in der Fußleiste mit Hintergrundfarbe versehen - Teil 2 datum

18.04.2023 16:57 (zuletzt bearbeitet: 23.04.2023 16:18)

Wolfgang

Administrator

Informationen anzeigen

Beitr�ge:	3447
Registriert seit:	10.12.2006
Blog:	Wolfgangs Blog

Homepage:	Nicht angegeben
Letzte Spende	Betrag � Forum Spende
Sternzeichen	Skorpion
Likes	1315

Aktive Links in der Fußleiste mit Hintergrundfarbe versehen - Teil 2

Xobor (v6)

Bussiness (v4)

Aktive Links mit Hintergrundfarbe versehen:

Eine weitere Idee wäre, die aktiven Links in der Fußleiste mit einer Hintergrundfarbe zu versehen, wie es oben in der Navi-Leiste bereits gemacht wird!

Was kann das Skript?

Die aktiven Links werden jetzt mit einer Hintergrundfarbe versehen. Man kann deutlich erkennen, welche Seite aufgerufen worden ist!
Die Hintergrundfarbe wird für alle aktiven Links in der Fußleiste gesetzt!
Das Skript funktioniert im Business (v4), im neuen Xobor (v6) & Mobil!

Installation fürs Business (v4), Xobor (v6) & Mobil

Das komplette Skript kann der Einfachheit wegen für das Template (v4) in die Kopf- oder Fußzeile, für das neue Xobor V6 & Mobil nach Eigenes Javascript kopiert werden.

Das Skript kann auch für das Business (v4), Xobor (v6) & Mobil als Plugin unter "Untere Leiste - Header" angelegt werden!
Wichtig! Im Plugin muss rechts oben das "Unterstützte Template" markiert werden, Business - Template (144) & Mobil - Template (177), Auswahl mit Mausklick oder Strg + Mausklick!

Über den Befehlszeile stehen jeweils die Beschreibungen!
In Zeile Zeile 38 werden die aktiven Links im Xobor (v6) & Mobil mit Hintergrundfarbe, Schriftfarbe und mit Fett-Zeichnung versehen!
In Zeile Zeile 41 werden die aktiven Links im Business (v4) mit Hintergrundfarbe, Schriftfarbe und mit Fett-Zeichnung versehen!

1
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
34
35
36
37
38
39
40
41
42
43
 
<script>
window.addEventListener('load', function ( ) {
  // Bug V6 - "active" entfernen
  $('#footernav .nav-link.active').removeClass('active');
 
  // Seiten-Reload fürs Impressum
  $('#impressum_link').on('click', function() {
    location.href='/faq.php#impressum';
    location.reload();
  });
 
  if (document.location.href.indexOf('faq.php') > -1){
    if (document.location.href.indexOf('faq.php#impressum') === -1){
      // FAQ-Link aktiv setzen
      $('#faq_link').addClass('activ');
    } else {
      // Impressum-Link aktiv setzen
      $('#impressum_link').addClass('activ');
    };
  };
 
  // Mitglieder-Link aktiv setzen
  if (document.location.href.indexOf('userlist.php') > -1){
    $('#member_link').addClass('activ');
  };
 
  // Datenschutz-Link aktiv setzen
  if (document.location.href.indexOf('datenschutz.html') > -1){
    $('#privacy_link').addClass('activ');
  };
 
  // Fürs V4: User Online-Link aktiv setzen
  if (document.location.href.indexOf('useronline.php') > -1){
    $('#useronline_link').addClass('activ');
  };
 
  // Hintergrundfarbe bei aktiven Link - Xobor (v6) & Mobil
    $('#footernav .nav-link.activ').attr('style','background-color: rgba(255, 255, 255, 0.5); color: #555555; font-weight:bold;'); 
 
  // Hintergrundfarbe bei aktiven Link - Business (v4)
    $('.footer .activ').attr('style','background-color: rgba(255, 255, 255, 0.5);').find('a').attr('style','color: #222222; font-weight:bold;'); 
});
</script>
 

Schlie�en

Spoiler mit einem Klick öffnen und schließen!

Wolfgang

Antworten

Reihenfolge der Navigationsleiste im V6 ändern � � Das neue Template Xobor (v6) - alles so neu - alles so einfach ?

�hnliche Themen

Antworten

Letzter Beitrag

Mein Projekt Teilen Button
Erstellt im Forum Alles f�r Ihr eigenes Forum oder Ihrer Webseite - Fragen & Antworten von Daishi 11 28.03.2024 21:18
Daishi • Zugriffe: 575

Präsentationskalender - Darstellung interessanter Themen - Teil 1+2
Erstellt im Forum Alles f�r Ihr eigenes Forum oder Ihrer Webseite - Hilfe, Tricks & Tipps von Wolfgang

09.04.2024 00:35
von

Wolfgang • Zugriffe: 1935

Sprechblasen fürs Forum - Teil 1+2
Erstellt im Forum Alles f�r Ihr eigenes Forum oder Ihrer Webseite - Hilfe, Tricks & Tipps von Wolfgang 1 10.08.2022 18:49
Wolfgang • Zugriffe: 761
Farb-, Größen- und Textanpassung für den neuen Cookie - Hinweis / Teil 1-4
Erstellt im Forum Das neue Template Xobor (v6) von Wolfgang 9 06.03.2022 00:02
Wolfgang • Zugriffe: 2381
Plugin "Ecke 7 Links" modifizieren!
Erstellt im Forum Das neue Template Xobor (v6) von Wolfgang 8 15.12.2020 15:48
Wolfgang • Zugriffe: 1977

Bilder aus "Datei anhängen" mit einem Klick öffnen & schließen! - Für alle Templates! - Teil 1-4
Erstellt im Forum Das neue Template Xobor (v6) von Wolfgang

24.07.2024 11:08
von

Wolfgang • Zugriffe: 2655

External - Link - Grafik: Links deutlicher darstellen!
Erstellt im Forum Das neue Template Xobor (v6) von Wolfgang 3 13.07.2023 03:31
Kipper-Spedition • Zugriffe: 1268

Navigations-Pfad verbessern und anpassen - Teil 1-3!
Erstellt im Forum Alles f�r Ihr eigenes Forum oder Ihrer Webseite - Hilfe, Tricks & Tipps von Wolfgang

13.06.2024 11:12
von

Wolfgang • Zugriffe: 2578

Iconbar: "Inhalte integrieren" und "addPics" ausblenden!
Erstellt im Forum Alles f�r Ihr eigenes Forum oder Ihrer Webseite - Hilfe, Tricks & Tipps von Wolfgang

10.12.2023 14:14
von

Nara • Zugriffe: 3079

Foren Spende

Hallo !

Wir hoffen, dass Dir unser Forum gef�llt und Du Dich hier genauso wohlf�hlst wie wir.

Um Dir und den anderen Mitgliedern das Bestm�gliche bieten zu k�nnen, w�rden wir das Forum gern werbefrei gestalten, mit tollen neuen Extras erg�nzen.

Wenn Du uns dabei unterst�tzen m�chtest, kannst Du mit Hilfe einer kleinen Spende dazu beitragen.

Deine Spende hilft!

Spendenziel: 45 €

95%