不同的背景圖像

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沒有。我需要改變圖像（取消/ V）而不是背景顏色。菜單的每一個聲音必須有不同的圖像夫婦 – WolF

我給你的樣品，你可以改變背景圖像屬性 –

你的問題不是很清楚，但是從我的理解，你可以在錨標記中創建一個額外的跨度和目標它懸停：

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

看到這個：http://jsfiddle.net/YNd9R/1/

有許多方法可以簡化JavaScript/Jquery。我只提供這個樣本。

來源

2014-03-29 15:44:30

不同的背景圖像

回答

相關問題