| Autor |
Nachricht |
m
Moderator
Dabei seit: 18.11.2004
Ort: -
Alter: -
Geschlecht: 
|
Verfasst Do 20.11.2008 23:44
Titel
|
  |
|
Ne, sorry, hatte ich nur irgendwie überlesen, steht auf Seite 1. Die Grafik soll bei Hover verändert werden.
Heißt, du musst genauso vorgehen wie ich es zu Anfang sagte, nur anstatt der Grafik eine Hintergrundgrafik im
Hyperlink Element einsetzen (also eine Kombi aus meinem und Kashs Beispiel)...
Für den Hover Effekt setzt du am besten css sprites ein.
Zuletzt bearbeitet von m am Do 20.11.2008 23:45, insgesamt 1-mal bearbeitet
|
|
| |
   |
 |
| |
|
|
bender007
Threadersteller
Dabei seit: 19.09.2008
Ort: -
Alter: 28
Geschlecht:
|
Verfasst Do 20.11.2008 23:48
Titel
|
|
|
ah ok also in die php datei bevor der text gefüllt wird eine Grafik eingefügt die ich über css positioniere. Und dann den "hover effekt" schreiben (CSS) der eine Hintergrundgrafik über die html Grafik legt? Korrekt? Ich probiers mal...
*'*$§$)§$( Joomla News Module. Und das ist schon ein erweitertes bzw. verbessert  naja wie man es sieht...
|
|
| |
|
|
m
Moderator
Dabei seit: 18.11.2004
Ort: -
Alter: -
Geschlecht:
|
|
| |
|
|
bender007
Threadersteller
Dabei seit: 19.09.2008
Ort: -
Alter: 28
Geschlecht:
|
Verfasst Fr 21.11.2008 00:12
Titel
|
|
|
Yoo ne is klar hatte dedacht das das mit den sprites mit überlappen geht aber das verschiebt das nur...
Aber ist das überhaupt in meinem Fall möglich da die Grafik ja über HTML eingebunden ist?
|
|
| |
|
|
m
Moderator
Dabei seit: 18.11.2004
Ort: -
Alter: -
Geschlecht:
|
Verfasst Fr 21.11.2008 00:16
Titel
|
|
|
| bender007 hat geschrieben: | | Aber ist das überhaupt in meinem Fall möglich da die Grafik ja über HTML eingebunden ist? |
Nein, ich meinte doch du sollst sie als Hintergrundgrafik einsetzen (Kombi aus Kashs und meinem ersten Beispiel). 
In etwa so
| Code: | ul li {
padding-left: 10px;
}
ul li a {
background: url(deineGrafik.gif) no-repeat;
margin-left: -10px;
padding-left: 10px;
}
ul li a:hover {
background-position: verschieben...;
} |
|
|
| |
|
|
bender007
Threadersteller
Dabei seit: 19.09.2008
Ort: -
Alter: 28
Geschlecht:
|
Verfasst Fr 21.11.2008 00:34
Titel
|
|
|
achso meintest Du das verdammt sorry hab ich total falsch verstanden hab oben was von Hyperlink Element gelesen und dachte du meinstest damit das ich das in den html bzw. php code einbinden soll... hat überbrigens auch gefunzt.
Aber habs mit den Sprites gemacht und haut 1a hin!!!! Nur ich hab jetzt ne dicke frei Stelle zwischen dem Titel und dem (Weiter hohe ) text... Kommt das jetzt durch die Sprites bzw. ist das normal?
EDIT: OK habs mit n margin-bottom: -20px gelöst...
Krass vielen Dank Jungs!!!
Zuletzt bearbeitet von bender007 am Fr 21.11.2008 02:59, insgesamt 2-mal bearbeitet
|
|
| |
|
|
bender007
Threadersteller
Dabei seit: 19.09.2008
Ort: -
Alter: 28
Geschlecht:
|
Verfasst Sa 22.11.2008 15:49
Titel
|
|
|
hi,
sorry aber ich muss nochmal nerven und zwar hab ich Probleme im Internet Explorer 6 und 7. Und zwar habe ich herausgefunden das es an den margin- bzw am padding liegt, das Hover Bild wird direkt hinter dem Text des Titels angezeigt also nicht vorgerückt sondern direkt im Text, es schließt quasi mit dem unteren Text ab. Zusätzlich geht komischwerweise der letzte hover eintrag im ie6 nicht im Firefox alles supi aber im IE hinterlegt er nur die erste Zeile Weiß aber nicht das ganze li bzw die ganze class .gn_static_1. Hier der Code:
| Code: |
.gn_static_1 ul li {
list-style-type:none;
padding: 0 0 0 0;
width: 118px;
}
/** titel **/
.gn_static_1 ul li a {
font-family: Arial, Verdana, Helvetica, sans-serif;
font-weight: bold;
font-size: 12px;
text-transform: uppercase;
color:#274471;
background: transparent url(../../../images/default/navigation/slidingdoor/hover_bullet.gif) 0px 1px no-repeat;
margin-left: -20px;
padding-left: 20px;
width: 118px;
height: 15px;
text-decoration: none;
}
.gn_static_1 ul li a:hover {
background-position:0px -17px;
background-color:#FFFFFF;
text-decoration: none;
}
.gn_static_1:hover {
background-color:#FFFFFF;
text-decoration: none;
}
|
Dann habe ich noch eine Frage und zwar der Wert display:block; habe ich gelesen sollte im a stehen aber dadurch bekomme ich so eine unschöne frei Zeile zwischen Titel und dem nachfolgendem Text. Jemand ne Idee?
Danke Bender
Zuletzt bearbeitet von bender007 am So 23.11.2008 18:27, insgesamt 3-mal bearbeitet
|
|
| |
|
|
| |
|
|
| Ähnliche Themen |
Text in DIV zentrieren per CSS
[CSS] Submenü aus einer Liste stylen HILFE!
[html] div-tag: class oder id
problem mit css - speziell mit text im div-bereich
CSS Layout - Problem - Div verschiebt sich bei längerem Text
.img class --> css
|
|
Willkommen auf dem Portal für Mediengestalter
