CSS наведите div и повлияет на ребенка своего брата

Question

CSS наведите div и повлияет на ребенка своего брата

0

hi моя проблема о css3, поэтому здесь пример кода моей проблемы, где в том, что я хочу, это навести парусный идентификатор и внести изменения в идентификатор ребенка, спасибо

я пробовал использовать + и ~ знак, но все равно не использовать

надеюсь, что вы можете помочь мне в этой программе, спасибо большое

<div id="sibling"></div>

<div id="brother">
    <div id="child">
</div>

и я хочу, когда я нахожу sibling id, цвет фона id будет изменяться.

I am L 04 окт. 2013, в 21:35

Источник

0

Пожалуйста, включите код / CSS, который вы пробовали.
James Montagne 04 окт. 2013, в 19:36
0

Может также упоминаться как элемент "племянник"
Conqueror 04 окт. 2013, в 19:54

Теги:

javascript

jquery

html

css

3 ответа

0

Ни один из ранних ответов не решает проблему в целом, все они используют идентификатор для выбора брата. Это выбирает в настройке genral независимо от того, что означает идентификаторы

$(document).ready(function(){
    $("#sibling").hover(function(){
        $(this).siblings("div").children("div").css("background", "red");
    }, function(){
        $(this).siblings("div").children("div").css("background", "#e7e7e7");
    });
});

http://jsfiddle.net/SjgYM/

Sam Battat 04 окт. 2013, в 16:57

0

Как это

<div id="sibling">Sibling</div>

<div id="brother">
    Brother
    <div id="child">Child</div>
</div>

#sibling:hover + div #child {
    background-color: red;
}

chopper 04 окт. 2013, в 16:53

Ещё вопросы

Пожалуйста, включите код / CSS, который вы пробовали.
Может также упоминаться как элемент "племянник"

Daniel Imms · Accepted Answer · 2013-10-04T17-31-00.000Z

Вот рабочий пример. Возможно, у вас были проблемы, потому что твой тег #child не был закрыт или, может быть, ваш CSS был немного выключен.

демонстрация

HTML

<div id="sibling">Sibling</div>

<div id="brother">
    <span>Brother</span>
    <div id="child">Child</div>
</div>

CSS

#sibling:hover + #brother #child {
    background-color:red;
}

Обратите внимание, что следующий селектор сиблинга + не поддерживается в <= IE6.

Кроме того, я предполагаю, что это всего лишь пример или вы планируете иметь только одну из них на странице, поскольку идентификаторы должны быть уникальными. Если будут несколько наборов этих элементов, тогда вместо этого используйте классы. Вот пример использования классов.