Различные фоновые-изображения в меню

меня такая ситуация http://jsfiddle.net/Qy2T2/Различные фоновые-изображения в меню

HTML:

<div class="container"> 
<div class="row" style="margin-top:-5px;"> 
    <div class="col-xs-1"></div> 
    <div class="col-xs-10"> 
     <div class="box1" style="width:311px; float:left;"> 
      <div class="markermenu"> 
       <ul> 
        <li><a href="#">One</a></li> 
        <li><a href="#">Two</a></li> 
        <li><a href="#">Three</a></li> 
        <li><a href="#">Four</a></li> 
        <li><a href="#">Five</a></li> 
       </ul> 
      </div> 
     </div>

CSS:

.markermenu{ 
width: 311px; /*width of menu*/ 
} 

.markermenu ul{ 
list-style-type: none; 
margin: 1px 0; 
padding: 0; 
border: 1px solid #9A9A9A; 
} 

.markermenu ul li a{ 
background:url(http://arms.aora.tv/images/cancel-button.jpg) no-repeat 2px center; 
height:79px; 
color: #00014e; 
display: block; 
width: auto; 
padding: 30px 0; 
padding-left: 90px; 
text-decoration: none; 
border-bottom: 1px solid #B5B5B5; 
} 

* html .markermenu ul li a{ 
width: 150px; 
} 

.markermenu ul li a:visited, .markermenu ul li a:active{ 
color: #00014e; 
} 

.markermenu ul li a:hover{ 
color: black; 
background-color: #ffffcb; 
background-image:url(http://www.hdc.uk.com/images/med_tick_button.jpg); 
z-index:10;/*onMouseover image change. Remove if none*/ 
}

мне нужно иметь разные изображения слева для каждого голоса меню , Также мне нужно поместить некоторые другие изображения (стрелки), такие как фон (и наведение) на ПРАВИЛЬНОМ голосе меню.

Возможно ли это? Большое спасибо

источник

2014-03-29 WolF

проверить, что я обновил вашу скрипку. Надеюсь, вы хотите что-то вроде этого: http://jsfiddle.net/Ym6sy/ –

Mh no. Мне нужно изменить изображения (cancel/V), а не фоновый цвет. Каждый голос меню должен иметь разные пары изображений – WolF

Я дал вам образец, который вы также можете изменить свойство background-image –

Ваш вопрос не очень понятно, но от того, что я понимаю, что вы могли бы создать дополнительный срок в пределах тега привязки и целевой его зависании:

<a href="#">One 
    <span class="altImage"></span> 
</a>

Смотреть это: http://jsfiddle.net/YNd9R/1/

Есть способы упростить JavaScript/JQuery. Я только представил это как образец.

источник

2014-03-29 15:44:30

Различные фоновые-изображения в меню

ответ

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