was ist das css der aktuellen link wie wenn jemand geht zu ÜBER UNS seite dann über uns farbe geändert zu rot .... dann gehen sie auf KONTAKT US seite dann über uns farbwechsel auf standard und KONTAKT US farbwechsel zu rot .. ..Wie kann ich Css-Stil dem aktuellen Menü geben?
bitte helfen mir neuen Designer bin ......
Verwendung:
ersetzt li in Beispiel in css schwebt mit dem, was Elemente, das Sie in Ihrem aktuellen Code verwenden
zB.
li:hover{backgroundcolor:Red;}
li-Tag, falls Sie Menü entwerfen wie
<ul>
<li> Menu1</li>
<li> Menu2</li>
</ul>
Es ist eine Maus über css ich das wissen Ich möchte wissen, wenn sie auf aktuelle Link css wie jemand offen Startseite dann HOME-Menü Farbwechsel auf ROT ... .. – Jaiff
Whwn Sie auf spezifische Menü klicken, dass perticular Seite geöffnet. dann einfach tun,
schreiben Klasse für aktiv.
gelten diese, für Homepage
für Über uns Seite aktive Klasse Attribut Über uns li
<ul>
<li class="active">Home</li>
<li>Projects</li>
<li>About Us</li>
</ul>
Sie können nicht nur CSS verwenden, um zu bestimmen, welche Seite Ihre Benutzer derzeit ist - es ist nur werde es nicht tun. Sie müssen Ihr Markup anpassen, um einen Hook, den Ihr CSS verwenden kann, hinzuzufügen. Wie so -
<ul id="nav">
<li><a href="about.html" class="here">About Us</a></li>
<li><a href="contact.html">Contact</a></li>
</ul>
Wenn Sie eine statische HTML-Seite Gebäude sind, können Sie manuell den HTML-Code auf jeder Seite ändern, um die aktuelle Seite im Menü zu reflektieren.
Wenn Sie etwas Komplexeres erstellen, müssen Sie wahrscheinlich auf PHP oder JavaScript zurückgreifen, um die aktuelle Seite zu finden. Dieses Skript ist ein wenig alt (es ist von Jeremy Keith „DOM Scripting“), aber es wird die Arbeit machen:
function highlightPage(id){
//make sure DOM methods are understood
if(!document.getElementsByTagName) return false;
if(!document.getElementById) return false;
if(!document.getElementById(id)) return false;
var nav = document.getElementById(id);
var links = nav.getElementsByTagName('a');
for (var i=0; i < links.length; i++){
var linkurl = links[i].getAttribute('href');
var currenturl = window.location.href;
//indexOf will return -1 on non-matches, so we're checking for a positive match
if (currenturl.indexOf(linkurl) != -1) {
links[i].className = "here";
var linktext = links[i].lastChild.nodeValue.toLowerCase();
document.body.setAttribute("id",linktext);
}
}
}
addLoadEvent(function(){
highlightPage('nav');
});
function addLoadEvent(func){
var oldonload = window.onload;
if (typeof window.onload != 'function') {
window.onload = func;
} else {
window.onload = function(){
oldonload();
func();
}
}
}
Dieses Skript in einem externally linked javascript file gehen würde.
Ich möchte dies auf meinem alle 8 Links wie Menü, über uns, kontaktieren Sie uns, products..etc .... – Jaiff
Das ist, was dieses Skript tut - es fügt die Klasse "hier" zu dem Nav-Element, das die aktuelle übereinstimmt Fensterpfad, dynamisch. Es ist nicht die beste Idee, sich auf JavaScript für diese Art von Dingen zu verlassen, aber es funktioniert. – chipcullen
Geben Sie dem Körper einen ID-Namen <body id="about-us">. Ihr Link benötigt auch eine ID <a href="#" id='this-link">. Dann:
#about-us #this-link {
color:red;
}
#contact-us #this-link {
}
hallo Sie aktive Klasse verwendet wird, kann .. –