Suche im Forum:
Suchen


« Vorheriges Thema anzeigen :: Nächstes Thema anzeigen »  
Autor Nachricht
Beitrag22.03.2009 um 14:15 (UTC)    
Titel: Buttons - hover, link, active...

Hallo,

Weiß jemand wie ich bei buttons buttons (gif's) mit hover active und so auf einen Link verweisen kann?

Ich habe jetzt einen Button als link, der sich aber nicht ändert. Wie kann ich denn jetzt mit js machen das sich das bild ändert, wenn ich hover bwz. draufklick. Wie hier nur halt mit buttons:
Code:
a:link{ color: black; }
a: hover{ color=blue; }
a: active{ color=red; }
Beitrag22.03.2009 um 17:12 (UTC)    
Titel:

Versuch mal, die Farbe mit Hex-codes einzugeben:

a:link{ color: #000000; }
a:hover{ color: #Code für blau; }
a:active{ color: #Code für rot; }

Grüßle, Tanja
______________
Wir leben alle unter dem selben Himmel, aber wir haben nicht alle den selben Horizont. - Konrad Adenauer



Zuletzt bearbeitet von tanjaswebsite am 22.03.2009, 18:12, insgesamt einmal bearbeitet
Beitrag22.03.2009 um 17:57 (UTC)    
Titel:

Ok werd ich tun, aber ich möchte, dass eine Grafik sich ändert, wenn man hovert oder draufklickt.
Was hat das mit hex-codes zu tun.

Ps:
Code:
a:link{ color: #000000; }
a:hover{ color: #0000FF; }
a:active{ color: #FF0000; }
Beitrag22.03.2009 um 18:01 (UTC)    
Titel:

Dann mußt Du einzelne Buttons erstellen und als Bild einfügen und nicht nur die Textfarbe ändern.

Grüßle, Tanja
______________
Wir leben alle unter dem selben Himmel, aber wir haben nicht alle den selben Horizont. - Konrad Adenauer

Beitrag22.03.2009 um 18:04 (UTC)    
Titel:

Erzähl bitte mal, welche Buttons Du genau meinst.
Im Moment sehe ich auf Deiner HP das leere CSS-Design Wink
Beitrag22.03.2009 um 18:19 (UTC)    
Titel:


das als normales


das als gedrücktes

das als hover:


Edit: Nur dann mit HOME o.ä. drauf


Zuletzt bearbeitet von pythonfreak am 22.03.2009, 19:19, insgesamt einmal bearbeitet
Beitrag22.03.2009 um 18:54 (UTC)    
Titel:

a {background: url(BILDADRESSE-Normal);}
a:hover {background: url(bildadresse-hover);}
a:active {background: url(bildadresse-gedrückt);}

Mfg
______________
THE JOY OF NOT BEING SOLD ANYTHING
Beitrag22.03.2009 um 20:21 (UTC)    
Titel:

Das funktioniert soweit, doch wie kann ich das machen das die Links dann immer genauso groß sind wie das Bild.
Schaut mal wie das jetz aussieht: HIER

Sorry, ich kenne mich nicht so gut mit HTML und sowas aus. Hab erst ein Buch gelesen

MfG Robin
Beitrag22.03.2009 um 20:41 (UTC)    
Titel:

Zitat:
a {background: url(BILDADRESSE-Normal);height:43px;width:142px;}
a:hover {background: url(bildadresse-hover);height:43px;width:142px;}
a:active {background: url(bildadresse-gedrückt);height:43px;width:142px;}


Probier es mal so
______________


Beitrag23.03.2009 um 16:48 (UTC)    
Titel:

Nein so funktioniert es auch nicht Crying or Very sad Crying or Very sad Crying or Very sad
Wink
Beitrag23.03.2009 um 17:15 (UTC)    
Titel:

so ich schreibe erneut
hab den post eben gelöscht, um noch einmal drauf aufmerksam zu machen
habe es getestet und überarbeitet:
Code:
li.nav_element {
   list-style:none;
   background-image: url(http://img.webme.com/pic/p/pythonfreak/buttonnotpressed.gif);
   background-repeat: no-repeat !important;
   border:0px !important;
   height:43px !important;
   width:142px !imortant;
   padding-left:30px;
   padding-top:10px;
}
a.menu {
   text-decoration:none;
   color:#ffffff;
}
li.nav_element:hover {
   background: url(http://img.webme.com/pic/p/pythonfreak/buttonhover.gif);
}
li.nav_element:active {
   background: url(http://img.webme.com/pic/p/pythonfreak/buttonpressed.gif);
}


bei mir funktioniert es, momentan auch bei mir sichtbar
unter a.menu kannst du die textfarbe verändern..
ich hoffe, das klappt so bei dir


edit://
dieser code funktioniert automatisch mit der navigation
ich hielt es für unpassend, es für alle links versuchen zu wollen
ebenso ist ein bereich, eine area benötigt, um width und height wirken zu lassen
der ist mit dem a tag nicht gegeben, daher hab ich den li tag aus der navi dazu genommen
ich nahm einfach mal an, dass du es für die navigation haben möchtest
wenn ich falsch liege, dann kann ich den code auch gern noch einmal für dich anpassen
sag nurm, wofür du es brauchst
aber wie gesagt, dieser funktioniert mit der navi.. Smile


edit2://
habe mal mit webdeveloper css auf deiner seite ersetzt und getestet
http://asgar.bplaced.net/data/bsppython.png
die navi gut zu sehen, hat alles funktioniert
ich habe deinen kompletten teil
Code:
<!--
                  <frameset cols="200,*" frameborder="0">
  <frame src="http://pythonfreak.de.tl/Naviagtion.htm" name="Navigation" scrolling="no" />
  <frame src="http://pythonfreak.de.tl/Home.htm" name="Inhalt" scrolling="no" />
</frameset>         //-->

<!--
a {background: url(http://img.webme.com/pic/p/pythonfreak/buttonnotpressed.gif);height:43px;width:142px;}
a:hover {background: url(http://img.webme.com/pic/p/pythonfreak/buttonhover.gif);height:43px;width:142px;}
a:active {background: url(http://img.webme.com/pic/p/pythonfreak/buttonpressed.gif);height:43px;width:600px;}
-->


mit dem oribgen code ersetzt

Unterer Code ist DEIN bisheriger Code unter CSS oO
Oberer Code ist das, was funktioniert! Für die Navigation

Oberen Code anstatt des unteren Nutzen!


wozu die frames waren, weiß ich grad eh nicht, aber okay oO die seite hat bei mir ohne auch sehr schön funktioniert xD stand unter css, also..
musst du wissen, ich habs wie gesagt im test mal komplett ersetzt
______________


Zuletzt bearbeitet von AsgarSerran am 23.03.2009, 19:56, insgesamt 3-mal bearbeitet
Beiträge der letzten Zeit anzeigen:   


Powered by phpBB © 2001, 2005 phpBB Group
Deutsche Übersetzung von phpBB.de