В моем script есть 3 div. Я хочу отображать div с классом ab при наведении на первую строку и отображать div с классом abc, когда наведите курсор на вторую строку. В противном случае я хочу diplay div с классом по умолчанию.
Но он никогда не отображает div с классом a.
HTML:
<a id="f">Show First content!</a>
<br/>
<a id="s">Show Second content!!</a>
<div class="a">Default Content</div>
<div class="ab">First content</div>
<div class="abc">Second content</div>
CSS
.abc,.ab {
display: none;
}
#f:hover ~ .ab {
display: block;
}
#f:hover ~ .abc,.a {
display: none;
}
#s:hover ~ .abc {
display: block;
}
#s:hover ~ .ab,.a {
display: none;
}
Вот моя сценарий моей проблемы http://jsfiddle.net/mridulpv/n5fzB/1/