zurück zur Startseite
  


Zurück XHTMLforum > (X)HTML und CSS > CSS
Seite neu laden Hintergrundbilder für einzelne Navigationspunkte

Antwort
 
LinkBack Themen-Optionen Ansicht
  #1 (permalink)  
Alt 15.04.2013, 12:14
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 15.04.2013
Beiträge: 2
golife befindet sich auf einem aufstrebenden Ast
Unglücklich Hintergrundbilder für einzelne Navigationspunkte

Hallo!

Ich habe ein kleines Problem bei der Umsetzung einer Homepage.

Zurzeit besteht die Navi aus 6 Feldern, die alle einen grauen Hintergrund und das selbe Bild beim Hover-Effekt haben.

Nun wünscht der Kunde aber, dass jeder Navipunkt ein eigenes Hintergundbild (transparentes PNG 15% des Hover-Bildes) und ein eigenes Bild beim Hover-Effekt hat. (100% des Bildes)

Wie kann ich das umsetzen?
Ich würde ja jedem Navipunkt eine eigene Klasse geben, die ich dann im Backend eintrage.
Aber wie genau kann ich das machen?
Mir fehlt die Starthilfe

CSS Code aktuell:
Code:
#dropmenu a {

    color:#FFFFFF;
    display:block;
    float:left;
    font-size:18px;
    margin-right:0px;
    text-decoration:none;
    line-height: 181px;
    height: 181px;
    width:180px;
    padding:0px;
    text-align:center;
    margin-right:10px;
    margin-bottom:10px;
    background:url(images/menu_item.png) no-repeat;
    text-transform:uppercase;
    font-family: 'PT Sans Narrow', sans-serif;
}

#dropmenu a:hover {

    background:url(images/menu_hover.png) no-repeat;
    text-indent:-9999px;
}

#dropmenu li {float:left; position:relative;}
#dropmenu ul {position:absolute; display:none;  top:30px;; left:0px;}
Mit Zitat antworten
Sponsored Links
  #2 (permalink)  
Alt 15.04.2013, 12:48
?!?
XHTMLforum-Kenner
 
Registriert seit: 20.03.2013
Beiträge: 1.638
explanator sorgt für eine eindrucksvolle Atmosphäreexplanator sorgt für eine eindrucksvolle Atmosphäre
Standard

Da jeder Navipunkt eine eigenes Hintergundbild hat, würde ich sogar eine ID vergeben statt einer Klasse. Ist eindeutig und lässt sich im CSS direkt ansprechen.

Anders wirst du es wohl kaum hinbekommen, schon allein wegen des Hovereffektes.

EDIT: Als Profi solltest du wissen, dass man 1. keine Crosspostings erstellt und 2. wie man sowas umsetzt.
__________________
"Wieso ist der Code schrott, ich dachte hier seien Profis..."
Aus einem Forum.

Geändert von explanator (15.04.2013 um 12:56 Uhr)
Mit Zitat antworten
Sponsored Links
  #3 (permalink)  
Alt 15.04.2013, 12:57
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 15.04.2013
Beiträge: 2
golife befindet sich auf einem aufstrebenden Ast
Standard

Vielen dank schonmal.

Doch leider kann das so auch nciht funktionieren,
da ich mit WP arbeite und dort für die vorgesehenen Seiten nur
Klassen eingeben kann. (sry hätte ich vorher erwähnen sollen)
Mit Zitat antworten
  #4 (permalink)  
Alt 15.04.2013, 13:04
?!?
XHTMLforum-Kenner
 
Registriert seit: 20.03.2013
Beiträge: 1.638
explanator sorgt für eine eindrucksvolle Atmosphäreexplanator sorgt für eine eindrucksvolle Atmosphäre
Standard

Thema von meiner Seite erledigt. Sucht euch professionelle Hilfe.
__________________
"Wieso ist der Code schrott, ich dachte hier seien Profis..."
Aus einem Forum.
Mit Zitat antworten
  #5 (permalink)  
Alt 16.04.2013, 20:50
Erfahrener Benutzer
XHTMLforum-Mitglied
 
Registriert seit: 12.11.2010
Ort: Bad Langensalza
Beiträge: 733
gabischatz ist in Verruf geraten
Standard

Wie sieht es aus mit jQuery der Navigation nachträglich die fehlenden ids zu verpassen? und diese mittels css, wie es explanator angesprochen hat zu stylen.
Nachtrag: Mein Template hat in der Navigation ids
PHP-Code:
<div id="navigation" class="clearfix">
                    <
ul id="dropmenu2" class="menu"><li id="menu-item-112" class="menu-item menu-item-type-taxonomy menu-item-object-category menu-item-112"
MfG

Geändert von gabischatz (16.04.2013 um 20:57 Uhr)
Mit Zitat antworten
  #6 (permalink)  
Alt 16.04.2013, 21:01
?!?
XHTMLforum-Kenner
 
Registriert seit: 20.03.2013
Beiträge: 1.638
explanator sorgt für eine eindrucksvolle Atmosphäreexplanator sorgt für eine eindrucksvolle Atmosphäre
Standard

@ Gabischatz

Crossposting zu Hintergrundbild einzelnen Navipunkten zuweisen
__________________
"Wieso ist der Code schrott, ich dachte hier seien Profis..."
Aus einem Forum.
Mit Zitat antworten
Antwort

Stichwörter
background image, hintergrund, hover, navigation

Themen-Optionen
Ansicht

Forumregeln
Es ist Ihnen nicht erlaubt, neue Themen zu verfassen.
Es ist Ihnen nicht erlaubt, auf Beiträge zu antworten.
Es ist Ihnen nicht erlaubt, Anhänge hochzuladen.
Es ist Ihnen nicht erlaubt, Ihre Beiträge zu bearbeiten.

BB-Code ist an.
Smileys sind an.
[IMG] Code ist an.
HTML-Code ist aus.
Trackbacks are an
Pingbacks are an
Refbacks are aus


Ähnliche Themen
Thema Autor Forum Antworten Letzter Beitrag
zwei hintergrundbilder? pino.bonbon CSS 9 15.01.2009 19:31
zwei Hintergrundbilder standard CSS 6 23.12.2007 17:44
Hintergrundbilder überlagern icepm CSS 3 13.12.2007 12:43
Einzelne Frames nicht ausdrucken Spardie CSS 4 29.08.2006 16:49
IE zeigt Hintergrundbild(er) nicht ganz an... nueffl CSS 5 30.06.2006 12:19


Alle Zeitangaben in WEZ +2. Es ist jetzt 08:44 Uhr.