Suche im Forum:
Suchen


« Vorheriges Thema anzeigen :: Nächstes Thema anzeigen »  
Autor Nachricht
Beitrag18.04.2011 um 08:55 (UTC)    
Titel: Hoverbutton verschieben?

Hallo, mal wieder eine Frage. Wink
Nachdem ich jetzt länger ein wenig rumprobiert habe will ich endlich eine vernünftige seite und beginne damit bei Null.
Nun ist meine Frage: Mein Button soll sich bei Hover ein Stückchen verschieben. Allerdings scheint nichts zu funktionieren! Hat jemand eine idee?
lg
Beitrag18.04.2011 um 09:30 (UTC)    
Titel:

Ich habs jetzt mal mit
Code:
td#nav_Home a:hover, td#nav_News a:hover {color:#00007f; padding-left: 5px;}

probiert, aber dann verschiebt sich nur die schrift, ist zwar auch toll, ich will aber das die Button sich verschieben...
lg[/code]
Beitrag04.05.2011 um 17:20 (UTC)    
Titel:

Hallo??
Beitrag04.05.2011 um 17:40 (UTC)    
Titel:

du musst ein rahmen um die buttons direkt im code machen, damit kannst du den eindruck erwecken, dass sich der button verschiebt.

2E3839 ist die rahmenfarbe des hintergrundes, quasi wo die buttons drin liegen.

http://666kb.com/i/bt7b74npkge9yslbz.png ist dein button ohne rahmen.

Zitat:


td.nav{background-image: url(http://666kb.com/i/bt7b74npkge9yslbz.png);background-color:#XXXXXX;width:
185px;height: 33px;border-bottom: 1px solid #2E3839;border-top: 1px solid #2E3839; border-left: 1px solid #2E3839; border-right: 1px solid #2E3839; }



somit hättest du den button 4 verschiedene rahmen gegeben. wenn du nun mit dem maßen links und rechts spielst (hier wären es 1 pixel left und right) kannst du die rahmen an den stellen breiter machen und damit einen effekt erzielen, als ob der button wandert.

beim hoverbutton änderst du es dann dementsprechend.

wie gesagt, musst nur left und right anpassen.

gruss gringo
______________
Mein Youtube Kanal | Standard-Designs als Red Design ohne rechte Boxen | Tips zum Design Professionell

Beitrag04.05.2011 um 17:42 (UTC)    
Titel:

Danke für die Mühe! Hab schon was gefunden:

Code:
td.nav:hover {
background-position: -19px -0px;
background-repeat: no-repeat;}


Danke nochmal Wink

Ich hab aber noch ne Frage:
Kann ich es irgendwie machen dass der button von Zeichenschule eine Außnahme ist, weil es ja kein Link ist?
lg
Beitrag04.05.2011 um 17:44 (UTC)    
Titel:

du kannst bei der seite editieren ja eingeben, das es ohne link ist. schau bei optionen.

gruss gringo
______________
Mein Youtube Kanal | Standard-Designs als Red Design ohne rechte Boxen | Tips zum Design Professionell

Beitrag04.05.2011 um 17:46 (UTC)    
Titel:

ja ich meine dass es eine außnahme vom Hover ist, sonst denken die leute ja alle dass man es anklicken kann! Wink
Beitrag04.05.2011 um 17:51 (UTC)    
Titel:



hab doch geschrieben was zu tun ist. editiere die seite, öffne die optionen und mach die seite als menüpunkt ohne link.

gruss gringo
______________
Mein Youtube Kanal | Standard-Designs als Red Design ohne rechte Boxen | Tips zum Design Professionell



Zuletzt bearbeitet von 6p-iceblue am 04.05.2011, 18:53, insgesamt einmal bearbeitet
Beitrag05.05.2011 um 15:33 (UTC)    
Titel:

Jaaaaaaaaaa, das weiß ich!
Es ist ja kein Link, es soll sich nur nicht wie die anderen Button beim hover verschieben!! Wink
Beitrag05.05.2011 um 16:30 (UTC)    
Titel:

oops, mein fehler, dachte dann kommt kein hovereffekt.

schalte ihn aus, indem du auf der seite im quelltext den gleichen code für den hover schreibst wie den eigentlichen navicode:

Code:
<style type="text/css">
<!--
td.nav:hover {background-image: url(http://img.webme.com/pic/m/modedesignerin/buttongrun.gif);}
-->
</style>


oder im designcode:

Code:
td#nav_Zeichenschule:hover{background-image: url(http://img.webme.com/pic/m/modedesignerin/buttongrun.gif);}


Zuletzt bearbeitet von 6p-iceblue am 06.05.2011, 15:32, insgesamt 2-mal bearbeitet
Beitrag07.05.2011 um 16:13 (UTC)    
Titel:

Vielen Dank Wink
Mit dem Code hats nicht geklappt dafür aber:
Code:
td#nav_Zeichenschule:hover{
background-position: 0px 0px;}

lg
Beiträge der letzten Zeit anzeigen:   


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