Наведение нескольких разделов при таргетинге на один

Hello Stack Overflow ProsНаведение нескольких разделов при таргетинге на один

Id нравится наводить несколько div, когда я нахожу изображение. Существует панель навигации поверх различных изображений, когда я нахожу изображение . Я хочу вызвать навигацию выше.

Вот некоторый код:

Вы можете увидеть, что нав подчеркнут. Я хочу, чтобы он срабатывал, когда я нажимаю на изображение.

Большое спасибо за помощь!

#nav_start_container { 
 

 
\t float:left; 
 
\t position:relative; 
 
\t margin-left:60px; 
 

 

 
} 
 

 
#nav_start_container ul li { 
 
    min-width:136px; 
 
\t float:left; 
 
\t position:relative; 
 
\t margin:0; 
 

 
} 
 

 

 
.nav_start { 
 

 
    min-width:136px; 
 
\t display: inline-block; 
 
\t color: #495d7f; 
 
\t text-decoration: none; 
 
\t font-size: 15px; 
 
\t font-weight: 550; 
 
\t margin-bottom:20px; 
 
\t text-align:center; 
 
} 
 

 
.nav_start:hover { 
 
    
 
\t text-decoration: underline; 
 
\t background: #fff !important; 
 
\t color: #495d7f; 
 
\t -webkit-transition: all 0.1s ease-in-out; 
 
\t -moz-transition: all 0.1s ease-in-out; 
 
\t -o-transition: all 0.1s ease-in-out; 
 
\t -ms-transition: all 0.1s ease-in-out; 
 
\t transition: all 0.1s ease-in-out; 
 

 
} 
 

 
#current { 
 
text-decoration: underline !important; 
 
\t background: #fff !important; 
 
\t color: #495d7f !important; 
 
\t 
 
} 
 

 
.bannerbild { 
 
margin:0; 
 
} 
 

 

 
.bannerbild:hover { 
 

 
padding-top:7px; 
 
position:absolute; 
 

 

 
}

\t <div id="nav_start_container"> 
 
\t <ul id="nav"> 
 
\t 
 
\t <li> 
 
     <a href="portrait.html"> 
 
       <span class="nav_start">test2</span> 
 
       <img src="images/1a.jpg" alt="…" class="bannerbild" /> 
 
     </a> 
 
    </li> 
 
\t \t <li> 
 
     <a href="portrait.html"> 
 
       <span class="nav_start">test2</span> 
 
       <img src="images/1b.jpg" alt="…" class="bannerbild" /> 
 
     </a> 
 
    </li> 
 
\t \t <li> 
 
     <a href="portrait.html"> 
 
       <span class="nav_start">test2</span> 
 
       <img src="images/1c.jpg" alt="…" class="bannerbild" /> 
 
     </a> 
 
    </li> 
 
\t \t <li> 
 
     <a href="portrait.html"> 
 
       <span class="nav_start">test2</span> 
 
       <img src="images/1d.jpg" alt="…" class="bannerbild" /> 
 
     </a> 
 
    </li> 
 
\t \t <li> 
 
     <a href="portrait.html"> 
 
       <span class="nav_start">test2</span> 
 
       <img src="images/1e.jpg" alt="…" class="bannerbild" /> 
 
     </a> 
 
    </li> 
 
\t \t <li> 
 
     <a href="portrait.html"> 
 
       <span class="nav_start">test2</span> 
 
       <img src="images/1f.jpg" alt="…" class="bannerbild" /> 
 
     </a> 
 
    </li> 
 
\t 
 
\t 
 
\t \t 
 
\t </ul> 
 

 

 

 
\t \t 
 
\t \t \t \t <div class="clear"></div> \t 
 
</div> 
 
\t \t 
 
\t \t 
 
\t

источник

2014-09-30 Anonymous

Можете ли вы предоставить скрипку. –

уверен: http://jsfiddle.net/erd6q21m/ спасибо! – 2014-09-30 12:32:52

Вы можете объединить необходимые элементы для каждого пункта меню в ссылке.

<li> 
     <a href="test2.html"> 
       <span class="link-text">test2</span> 
       <img src="images/1b.jpg" alt="…" class="banner-image" /> 
     </a> 
    </li>

Теперь, если вы установите :hover определение по ссылке, он будет работать, если вы мышь над текстом ссылки или изображения. Вы также не должны повторять все основные навигационные ссылки (они будут прочитаны дважды с помощью вспомогательных технологий и ботов поисковой системы ...)

источник

2014-09-30 12:40:54 feeela

спасибо человеку - можно ли настроить его, если я нахожу изображение, которое оба (link-text) завис, НО, если я навещу текст - только текст зависнет? – 2014-09-30 12:55:51

ive очистил код - спасибо за совет - но до сих пор не знаю, как я могу навешивать и при падении изображения – 2014-09-30 13:41:42

Наведение нескольких разделов при таргетинге на один

ответ

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