tutorials.de Buch-Aktion 05/2012
ERLEDIGT
NEIN
ANTWORTEN
3
ZUGRIFFE
424
EMPFEHLEN
  • An Twitter übertragen
  • An Facebook übertragen
AUF DIESES THEMA
ANTWORTEN
  1. #1
    Extremefall Extremefall ist offline Mitglied Bronze
    Registriert seit
    Apr 2011
    Beiträge
    39
    Hallo,
    ich habe folgenden Beispielcode:
    HTML-Code:
    div.menu:hover{
    display:block;
    background-color: #ffffff;
    // hier sollte der Zugriff auf die andere Klasse erfolgen
    }
    Nun möchte ich gerne, wenn über das DIV der Klasse menu die Maus geht, dass die Hintergrundfarbe der Divs der Klasse menuitem geändert werden. Also soll die Formatierung sich nicht auf die Klasse menu sondern auf die Klasse menuitem beziehen. Ist so etwas mit CSS möglich, dass die Formatierung auf eine andere Klasse übertragen wird? Wenn ja, wie geht das?
     

  2. #2
    CPoly CPoly ist offline Mitglied Weizenbier
    tutorials.de Premium-User
    Registriert seit
    Sep 2009
    Beiträge
    2.445
    Befinden sich denn alle ".menuitem" unterhalb von ".menu"? Dann einfach so

    Code css:
    1
    2
    3
    
    div.menu:hover .menuitem {
     
    }
     

  3. #3
    Extremefall Extremefall ist offline Mitglied Bronze
    Registriert seit
    Apr 2011
    Beiträge
    39
    Nein, so ist es leider nicht. Ich würde nämlich gerne eine vertikale Navigation mit Aufklappmenü in CSS realisieren. Hier mein ganzer Code:
    HTML-Code:
    <html>
    <head>
    <style type="text/css">
    .menu{
    width: 100px; 
    background-color: #000000;
    }
    .menuitem{
    width: 100px;
    position: relative;
    display: block;
    float: right;
    background-color: #003399;
    }
    div.menu:hover{
    display:block;
    background-color: #ffffff;
    }
    </style>
    </head>
    <body>
    <div class="menu">Menü</div>
    <span><div class="menuitem">Menuitem</div></span>
    </body>
    </html>
     

  4. #4
    CPoly CPoly ist offline Mitglied Weizenbier
    tutorials.de Premium-User
    Registriert seit
    Sep 2009
    Beiträge
    2.445
    Erstmal: DIV in SPAN geht nicht, weil span kein Block Element ist.

    Man würde ein solches Menü mittels Listen aufbauen. Und normalerweise kann man dann diesen Selektor benutzen. Beispiel:

    HTML-Code:
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en">
    <head>
    	<meta http-equiv="content-type" content="text/html; charset=UTF-8" />
    	
    	<title>Vertikales Menü</title>
    	
    	<style type="text/css">
    	.submenu {
    		display:none;
    	}
    	
    	.menu:hover .submenu {
    		display:inline;
    	}
    	</style>
    </head>
    
    <body>
    	<div>
    		<ul class="menu">
    			<li>Menü</li>
    			<li class="submenu">
    				<ul>
    					<li>Menüitem</li>
    					<li>Menüitem</li>
    					<li>Menüitem</li>
    				</ul>
    			</li>
    		</ul>
    	</div>
    </body>
    
    </html>
    Ansonsten könntest du, sofern du das SPAN Element entfernst, auch den Geschwister Selektor benutzen (Browser support beachten!)

    Code css:
    1
    2
    3
    
    div.menu:hover ~ .menuitem {
     
    }
     

Ähnliche Themen

  1. Mit einer Klasse Objekte für eine andere Klasse erstellen.
    Von New2Java im Forum Java Grundlagen
    Antworten: 14
    Letzter Beitrag: 21.11.10, 12:37
  2. Methode in andere Klasse aufrufen?
    Von jbjb im Forum Java Grundlagen
    Antworten: 2
    Letzter Beitrag: 07.01.10, 21:49
  3. .klasse:hover Problem
    Von dsNDesign im Forum CSS
    Antworten: 2
    Letzter Beitrag: 26.01.09, 12:59
  4. Antworten: 2
    Letzter Beitrag: 02.01.07, 16:27
  5. Antworten: 4
    Letzter Beitrag: 29.09.06, 20:46