Autor |
Nachricht |
-
siegburger-locations
Wohnort: Siegburg
|
19.09.2010 um 20:51 (UTC) Titel: Button-Code ändern !!!! |
|
|
Hi zusammen,
Wer kann mir diesen Code ändern damit ich nen 2. Button als Hover machen kann der nach rechts 5 mm ausfährt ?
Code: <a href="http://www.siegburger-locations.de/G.ae.stebuch.htm" target="_blank" style="position: absolute; top: 28px; left:50%; margin-left: -50%;"><img border="0" src="http://img.webme.com/pic/s/siegburger-locations/feeds.png" alt="Feedback"></a>
Gruss Paddi ______________
Zuletzt bearbeitet von siegburger-locations am 19.09.2010, 21:52, insgesamt einmal bearbeitet
|
|
↑
|
|
|
-
teora
|
20.09.2010 um 16:52 (UTC) Titel: |
|
|
Das ganze musst du mit einer div Box lösen, also mit CSS. Das sieht dann
ersteinmal so aus, also die normale Box, dort fügst du das Anfangsbild ein.
Zitat: #button{
background: url();
width: 00px;
height: 00px;
margin: 0px 0px 0px 0px;}
Nun kommt der interessante Teil, der Hover. Hier fügst du nun die Grafik ein
die 5mm länger ist.
Zitat: #button:hover{
background: url();
width: 00px;
height: 00px;
margin: 0px 0px 0px 0px;}
Beim ändern achte darauf, dass die margin Werte gleich bleiben und du die
exakten Grafikgrößen eingibst.
Einbinden musst du das ganze dann mit einem <div> tag, also ein Tag in dem
das CSS Element angesprochen wird.
|
|
↑
|
|
|
-
siegburger-locations
Wohnort: Siegburg
|
21.09.2010 um 00:19 (UTC) Titel: |
|
|
nur wo füge ich das alles ein ? ______________ |
|
↑
|
|
|
-
teora
|
21.09.2010 um 14:41 (UTC) Titel: |
|
|
Die ersten beiden bei CSS ohne Style Tags und den zweiten überall wo du den
Button willst. Achte darauf den Code bei Quelltext einzufügen, nicht beim norma-
len Textmodus, sonst wird es nicht gehen.
Zuletzt bearbeitet von teora am 21.09.2010, 15:42, insgesamt einmal bearbeitet
|
|
↑
|
|
|
-
siegburger-locations
Wohnort: Siegburg
|
28.09.2010 um 12:47 (UTC) Titel: |
|
|
Ja nur kommt jetzt folgendes Problem.
Sobald ich es an die richtige Stelle machen will verschiebt sich anstatt dem Button das ganze Design. ______________ |
|
↑
|
|
|
-
siegburger-locations
Wohnort: Siegburg
|
29.09.2010 um 18:35 (UTC) Titel: |
|
|
*PUSH* HILFE______________ |
|
↑
|
|
|
-
siegburger-locations
Wohnort: Siegburg
|
30.09.2010 um 18:34 (UTC) Titel: |
|
|
*PUSH* HILFE
Brauche dringend Hilfe !!! ______________
Zuletzt bearbeitet von siegburger-locations am 30.09.2010, 19:50, insgesamt einmal bearbeitet
|
|
↑
|
|
|
|
30.09.2010 um 19:28 (UTC) Titel: |
|
|
mir würde dazu nur einfallen, dass du den hinteren (rechten) teil des normalen buttons 5 mm transparent machst.
als hoverbutton nimmst den gleichen, jedoch machst du vorn (links) die ersten 5 mm transparent und fügst dann den button ein. dann würde es aussehen als ob der button nach links wandert.
du brauchst den bestehenden button also nur ändern.
wenn der hintergrund der box in schwarz ist, brauchst du im normalen button nur die breite um 5 mm ändern (rechts in weiss oder transparent). und beim hoverbutton machst du links noch 5 mm schwarz ran. achte aber darauf, das beide dann trotzdem die gleiche breite haben, die die boxenbreite nicht überschreitet. allerdings musst du vorher das hintergrundbild der box ebenfalls ändern. du musst dann 5 mm die linke seite in weiss machen. sonst ergibt es ja nicht den effekt.
ich hoffe das ist einigermaßen verständlich.
gruss gringo ______________ Mein Youtube Kanal | Standard-Designs als Red Design ohne rechte Boxen | Tips zum Design Professionell
Zuletzt bearbeitet von 6p-iceblue am 30.09.2010, 20:29, insgesamt einmal bearbeitet
|
|
↑
|
|
|
-
siegburger-locations
Wohnort: Siegburg
|
30.09.2010 um 19:38 (UTC) Titel: |
|
|
Könntest du denn den Code mit Hover ändern ?
Code: <a href="http://www.siegburger-locations.de/G.ae.stebuch.htm" target="_blank" style="position: absolute; top: 28px; left:50%; margin-left: -50%;"><img border="0" src="http://img.webme.com/pic/s/siegburger-locations/feeds.png" alt="Feedback"></a> |
|
↑
|
|
|
|
|
↑
|
|
|
-
siegburger-locations
Wohnort: Siegburg
|
30.09.2010 um 21:29 (UTC) Titel: |
|
|
ok trotzdem danke dir.
so kann mir denn jemand anders beim Code umbau helfen ? ______________ |
|
↑
|
|
|
-
siegburger-locations
Wohnort: Siegburg
|
01.10.2010 um 09:53 (UTC) Titel: |
|
|
So jetzt hab ich den richtigen Code:
Code: <div style="position: absolute; top: 28px; left: 50%; margin-left: -50px;" id="http://img.webme.com/pic/s/siegburger-locations/feedbackbutton2.png"><a href="http://www.siegburger-locations.de/G.ae.stebuch.htm"><img border="0" onmouseout="this.src='http://img.webme.com/pic/s/siegburger-locations/feedbackbutton1.png'" onmouseover="this.src='http://img.webme.com/pic/s/siegburger-locations/feedbackbutton2.png'" src="http://img.webme.com/pic/s/siegburger-locations/feedbackbutton1.png" alt="" /></a></div>
Nur wie bekomme ich den Befehl das es mittig ist weg ?______________ |
|
↑
|
|
|
-
siegburger-locations
Wohnort: Siegburg
|
03.10.2010 um 18:06 (UTC) Titel: |
|
|
*PUSH* HILFE______________ |
|
↑
|
|
|
-
siegburger-locations
Wohnort: Siegburg
|
05.10.2010 um 12:32 (UTC) Titel: |
|
|
Push______________ |
|
↑
|
|
|
-
siegburger-locations
Wohnort: Siegburg
|
06.10.2010 um 14:00 (UTC) Titel: |
|
|
Push______________ |
|
↑
|
|
|
|