Le changement d'une autre div en arrière-plan lorsque passez la souris sur un autre div

D'essayer de changer un div couleur d'arrière-plan lors de l'passez la souris sur un autre div. Mais je ne peux pas le faire fonctionné. Été vu autour d'elle aujourd'hui, mais ne peut pas trouver un similair question.

<style type="text/css">
    #main {
        width: 960px;
        height: 600px;
        margin: auto;
        position: relative;
        background: red;
    }

    #trykk {
        width: 100px;
        height: 100px;
        background-color: yellow;
    }

    #trykk:hover #main {
        background-color: green;
    }
</style>

<div id="main">
    <div id="trykk">
    </div>
</div>

C'est le code que j'ai utilisé. Le seul problème est que je ne suis pas autorisé à utiliser le javascript. Donc est il possible que je peux changer la couleur de fond sur la div #main quand je survolez div #trykk?

OriginalL'auteur user1770961 | 2012-11-12

  1. 6

    Une démo liées à Rodik's répondre, comme il le dit, vous ne pouvez pas modifier sélectionnez parent à l'aide d'un enfant, donc vous ne pouvez pas changer le style de l'élément parent, mais si vous le souhaitez, vous pouvez modifier votre balisage, comme vous l'avez dit vous ne pouvez pas utiliser javascript, mais si vous pouvez modifier le balisage que ça va aller comme ça

    Demo1

    HTML

    <div id="main">Main</div>
<div id="trykk">Trykk</div>

    CSS

    #main:hover + #trykk {
    background-color: green;
}

    Ou si vous voulez insérer votre div comme vous le faites en ce moment, il suffit de changer le sélecteur comme ce

    Demo2

    HTML

    <div id="main">Main
<div id="trykk">Trykk</div>
</div>

    CSS

    #main:hover > #trykk {
    background-color: green;
}
    Ces exemples de changer la couleur de fond de #trykk, cependant la question des demandes de #principal de l'arrière-plan change de couleur
    Avez-vous seulement vu les exemples ou même de lire ma réponse? J'ai déjà dit que, dans ma réponse
    Ah, donc je ne peux faire ce travail si l'utilisation de javascript?
    la réponse est oui 🙂 ou si vous êtes capable de changer votre balisage
    Comme comment? @M. Exotiques

    OriginalL'auteur Mr. Alien

  2. 1

    CSS sélection ne fonctionne que d'une seule façon, de parent à enfant.

    D'un enfant de l'état, par conséquent, ne peut pas affecter les parents en état.

    Un javascript passage de la souris événement sera nécessaire pour mettre en œuvre ce type de fonctionnalité.

    OriginalL'auteur Rodik

  3. 0

    avec jquery, vous pourriez faire ceci:

    $(function(){
    $("#trykk").hover(function(){
        $("#main").toggleClass("greenBackground");
    });
});
    Le seul problème est que je ne suis pas autorisé à utiliser du javascript. avez-vous lu cela?

    OriginalL'auteur ThomasK