ilch Forum » Allgemein » HTML, PHP, SQL,... » js link hover problem

Geschlossen
  1. Sa. 17.12.2011 23:35 Uhr #1
    User Pic
    hanssonny Mitglied
    Registriert seit
    17.12.2011
    Beiträge
    4
    Beitragswertungen
    0 Beitragspunkte
    hi leute ich ändere mit js die farbe von meinen links wenn

    document.getElementById('link3').style.color = "#000000";

    so zum beispiel

    wenn ich das mache geht der hover effekt den ich über css festlege nicht mehr ...

    hat jemand eine idee wie ich das lösen könnte?
    0 Mitglieder finden den Beitrag gut.
  2. So. 18.12.2011 09:39 Uhr #2
    User Pic
    Mairu Coder
    Registriert seit
    16.06.2006
    Beiträge
    15.334
    Beitragswertungen
    386 Beitragspunkte
    Du musst dafür eine CSS Klasse anlegen und dem Element, dann die Klasse zuordnen, ggf. halt auch mit dem Hover in der css, geht natürlich nur, wenn es feste Farben sind, die nicht berechnet werden, ansonsten müsstest du das Hover auch mit JS machen, bzw. bei mouseover die Farbe wieder löschen.
    Und auch immer mal ein Blick auf die FAQ werfen. | Mairus Ilchseite
    0 Mitglieder finden den Beitrag gut.
  3. So. 18.12.2011 12:03 Uhr #3
    User Pic
    hanssonny Mitglied
    Registriert seit
    17.12.2011
    Beiträge
    4
    Beitragswertungen
    0 Beitragspunkte
    wie mach ich das bei mouseover die farbe wieder löschen? dass es wieder auf mein css zugreift?
    0 Mitglieder finden den Beitrag gut.
  4. So. 18.12.2011 12:13 Uhr #4
    User Pic
    Mairu Coder
    Registriert seit
    16.06.2006
    Beiträge
    15.334
    Beitragswertungen
    386 Beitragspunkte
    Die andere Methode ist einfacher.

    In der css hast du die Klasse bisher und anderefarbe lächeln

    Dein Link hat die Klasse bisher, und du willst ihm jetzt noch die Klasse anderefarbe geben (ein Element kann viele Klassen haben), dann müsste das so gehen:
    document.getElementById('link3').className = 'bisher anderefarbe';

    Allerdings kann es nötig sein, auch anderefarbe in der CSS den hover zuzuweisen.

    Das andere wäre dann ein Javascript event, das ist aber schwieriger zu verstehen, gerade bei einem Mouseover wo es dann 2 Events sind.
    Und auch immer mal ein Blick auf die FAQ werfen. | Mairus Ilchseite
    0 Mitglieder finden den Beitrag gut.
  5. So. 18.12.2011 12:18 Uhr #5
    User Pic
    hanssonny Mitglied
    Registriert seit
    17.12.2011
    Beiträge
    4
    Beitragswertungen
    0 Beitragspunkte
    okay probier ich mal


    das klappt so nicht:
    das ist mein link: 
    <li><a id="link1" class="normal" href="?leistung" onclick="buttonaendern();" >Leistungen</a></li>


    dass ist die funktion die die farbe ändert wenn die seite leistung aufgerufen wurde. .style.color das klappt aber mit der classe ädnern klappt nicht 
    function buttonaendern() {
	if(button == 1) {
		document.getElementById('link1').className = 'active'; 
		//document.getElementById('link1').style.color = "#729abd";
		document.getElementById('pfeil').style.paddingTop = "120px";
		document.getElementById('pfeil').innerHTML = "<span style=' padding-left: 10px;'><img src='include/designs/design/images/pfeil.png' alt='Pfeil' /></span>";
	}
}
    0 Mitglieder finden den Beitrag gut.
  6. So. 18.12.2011 12:29 Uhr #6
    User Pic
    Mairu Coder
    Registriert seit
    16.06.2006
    Beiträge
    15.334
    Beitragswertungen
    386 Beitragspunkte
    Ich bräuchte den Link zur betreffenden Seite, um dir da genauer weiterhelfen zu können, das mit der Klasse sollte auf jeden Fall funktionieren, allerdings gibts ja in css Rangfolgen, die festlegen welche Eigenschaft/Klasse genutzt wird und ich nehme mal an, dass bei deinem Fall da noch was anderes Vorrang hat.
    Und auch immer mal ein Blick auf die FAQ werfen. | Mairus Ilchseite
    0 Mitglieder finden den Beitrag gut.
  7. So. 18.12.2011 15:21 Uhr #7
    User Pic
    oink Mitglied
    Registriert seit
    23.09.2010
    Beiträge
    740
    Beitragswertungen
    227 Beitragspunkte
    "js link hover problem" .. 'onclick="buttonaendern();"'

    naaaaaa, merkste was ...

    bitte vergib klassen auf links und sprech die states über die entsprechenden pseudoelemente an. was du hier versuchst macht man nicht über JS sondern über CSS. 

    <li><a class="normal" href="?leistung">Leistungen</a></li>


    ul li a.normal:link { color:#f00; } /* normaler link */
ul li a.normal:hover { color:#0f0; }  /* link hoverstate */
ul li a.normal:active { color:#00f; }  /* link activestate */
ul li a.normal:visited { color:#f0f; }   /* link visitedstate */



    Zuletzt modifiziert von oink am 18.12.2011 - 15:21:53
    before creation there must be destruction
    0 Mitglieder finden den Beitrag gut.
  8. So. 18.12.2011 16:59 Uhr #8
    User Pic
    Mairu Coder
    Registriert seit
    16.06.2006
    Beiträge
    15.334
    Beitragswertungen
    386 Beitragspunkte
    Er hat ja ein css hover, und wollte dann per click die Farbe ändern, womit das Hover nicht mehr funktionierte.

    Er hat es wohl aber geschafft, mir das aber nur per PM mitgeteilt, so dass ich keine weitere Hilfestellung mehr leisten musste.
    Und auch immer mal ein Blick auf die FAQ werfen. | Mairus Ilchseite
    0 Mitglieder finden den Beitrag gut.
  9. Mo. 19.12.2011 08:03 Uhr #9
    User Pic
    holz Hall Of Fame
    Registriert seit
    17.11.2005
    Beiträge
    4.606
    Beitragswertungen
    117 Beitragspunkte
    ja ich hab es gelöst ist bisschen komplizierter das ganze musste es über js machen weil da noch diverese andere sachen gleichzeitig passieren sollen wenn das ganze fertig ist^^

    aber danke für eure hilfe^^ ... meistens steh ich nur irgendwie auf dem schlauch^^
    0 Mitglieder finden den Beitrag gut.
Geschlossen

Zurück zu HTML, PHP, SQL,...

Optionen: Bei einer Antwort zu diesem Thema eine eMail erhalten