2016-01-05 2 views
0

Я хочу настроить свойства двух divs через css, когда: наведите указатель мыши на один div.таргетинг 2 divs на один hover

#down-icn { 
position: absolute; 
bottom: 0; right: 25px; 
color: #fff; 
-webkit-transition: color 0.25s ease; border-color 0.5s ease; 
-moz-transition: color 0.25s ease; border-color 0.5s ease; 
-ms-transition: color 0.25s ease; border-color 0.5s ease; 
-o-transition: color 0.25s ease; border-color 0.5s ease; 
transition: color 0.25s ease; border-color 0.5s ease; 
} 

#down-icn:hover { 
color: #ef5c30; 
border-color: #ef5c30; 
} 

.icn { 
border: 2px solid #fff; 
border-radius: 50%; 
padding: 10px; 
margin-left: 10px; 
} 

!!! .icn:hover { 
border: 2px solid #000; 
color: #000; 
} 

при наведении на # вниз ICN Я хочу изменить свойства как # понижающего ICN и .icn.

EDIT - HTML

<a href="#footer-anchor"> 
     <div id="down-icn" data-0="opacity: 1; bottom: 25px;" data-550="opacity: 0; bottom: 100px;">more<i class="icn fa fa-chevron-down fa-2x"></i></div> 
    </a> 
+1

вы можете также добавить 'html'? –

+0

добавил html на вопрос – user3550879

+0

'# down-icn: hover .icn {/ * styles here * /}' –

ответ

0

Почему вы не просто использовать якорь для выбора парения?

a:hover > #down-icn{ 
color: #ef5c30; 
border-color: #ef5c30; 
} 


a:hover > .icn { 
border: 2px solid #000; 
color: #000; 
} 

ИЛИ

#down-icn:hover{ 
    color: #ef5c30; 
    border-color: #ef5c30; 
} 


#down-icn:hover > .icn { 
    border: 2px solid #000; 
    color: #000; 
} 
+0

отлично, вот что я искал – user3550879

Смежные вопросы