kostenloser Webspace werbefrei: lima-city

Server-Status

CSS: Pseudo-Klassen auswirkung

lima-city: free Hosting → Forum → Die eigene Homepage → HTML, CSS & Javascript

2. 13:29, 22.1.2011
   Autor dieses Themas

   ole-reglitzki

   

   Knecht

   

   868 Gulden

   Webspace unbegrenzt

   Hallo,
   ich wollte folgendes wissen:
   (wie) kann man in CSS einer tag/klasse">Klasse eine Eigenschaft zuordnen, solange eine Pseudo-Klasse eines anderen Elements aktiv ist.
   
   Also an einem Beispiel:
   

   CSS:
   #nummer1{
     width: 10px;
   }
   #nummer2:hover{
     HIER SOLL DIE BREITE VON #nummer1 AUF 20px GESETZT WERDEN
   }

   
   
   Google hat mir da nicht weitergeholfen :(
   
   Danke, Ole

3. Diskutiere mit und stelle Fragen: Jetzt kostenlos anmelden!

   lima-city: Gratis werbefreier Webspace für deine eigene Homepage

4. 15:09, 22.1.2011

   metalmachine

   

   Knecht

   

   1033 Gulden

   Webspace unbegrenzt

   Mittels CSS alleine ist das nicht möglich, dafür musst du JavaScript zu Hilfe nehmen. Siehe dazu die Event-Handler onmouseover und onmouseout, sowie das Objekt style.
5. 15:16, 22.1.2011
   Autor dieses Themas

   ole-reglitzki

   

   Knecht

   

   868 Gulden

   Webspace unbegrenzt

   Mit JScript könnte man es auf jeden Fall machen, da brauche ich keine Hilfe, aber ich meine, so etwas in der Art schon einmal in css gesehen zu haben...
   Würde JScript nur ungern benutzen.
   
   lg Ole
6. 15:22, 22.1.2011

   syberpsace

   Moderator

   Scharfrichter

   

   5304 Gulden

   Webspace unbegrenzt

   syberpsace besitzt 1 kostenlose Domain
   

   Angenommen du hast folgenden HTML-Code
   
   

   <div class="outer">
       text 
       <div class="inner">
           mehr text
       </div>
   </div>

   
   
   und folgende CSS-Datei
   

   div.inner{display:none;}
   div.outer:hover .inner {display:block}

   
   
   dann bedeutet das, dass das inner-div nur dann angezeigt wird, wenn :hover des outer-divs aktiv ist. Das ganze ist natürlich auf alle Pseudoklassen bzw Tags anwendbar.
   
   mfg
7. 16:01, 22.1.2011
   Autor dieses Themas

   ole-reglitzki

   

   Knecht

   

   868 Gulden

   Webspace unbegrenzt

   Danke, das geht allerdings nur (nach meinen Versuchen) mit einem untergeordneten Div, gäbe es dann noch eine möglichkeit, um das gleich bei
   

   <div class="outer">
       text 
   </div>
   <div class="inner">
       mehr text
   </div>

   
   zu bewirken?
   
   Beitrag zuletzt geändert: 22.1.2011 16:01:55 von ole-reglitzki
8. 16:18, 22.1.2011

   t*****b

   <div class="wrapper">
    <div class="outer">
       text 
    </div>
    <div class="inner">
        mehr text
    </div>
   </div>

   
   
   

   .wrapper .inner{display:none;}
   .wrapper:hover .inner {display:block}

9. 16:59, 22.1.2011
   Autor dieses Themas

   ole-reglitzki

   

   Knecht

   

   868 Gulden

   Webspace unbegrenzt

   dann müsste ich das div inner absolut positionieren, da es ja nicht passieren soll, wenn die Maus über inner ist, wodurch ich wieder viel weniger Handlungsfreiheit habe...
   In meinem Fall würde es ausreichen, aber der Interesse wegen würde ich gerne noch wissen, ob es anders möglich ist.

10. Diskutiere mit und stelle Fragen: Jetzt kostenlos anmelden!

    lima-city: Gratis werbefreier Webspace für deine eigene Homepage

Dir gefällt dieses Thema?