添加導航的滑塊

Question

我得到這個HTML代碼：

<div class="imgContent"> 
    <div id="galleryImg"> 
     <img class="img_<?php echo $this->id ?>_1" width="1200" height="450" src="<?php echo $this->baseUrl('f/images/'.$this->image[1]) ?>" /> 
     <?php if($this->image[4]){ ?> 
      <img class="img_<?php echo $this->id ?>_<?php echo $this->image[6] ?>" style="display:none" width="1200" height="450" src="<?php echo $this->baseUrl('f/images/'.$this->image[4]) ?>" /> 
     <?php } ?> 
     <?php if($this->image[5]){ ?> 
      <img class="img_<?php echo $this->id ?>_<?php echo $this->image[7] ?>" style="display:none" width="1200" height="450" src="<?php echo $this->baseUrl('f/images/'.$this->image[5]) ?>" /> 
     <?php } ?> 
    </div> 
    <a id="prev" href="javascript:void(0)"></a> 
    <a id="next" href="javascript:void(0)"></a> 
</div> 

我想從png文件上的圖像添加箭頭時，懸停。如何做到這一點（現在的形象正在改變點擊）

Answer 1

假設你的意思是說，你的a#prev和a#next應該有箭頭，當你將鼠標懸停div#galleryImg不是很確定，如果這是你的願望，你可以使用純CSS做類似這樣的內容：

a#prev, a#next { 
    display: inline-block; 
    width: 20px; 
    height: 20px; 
} 
div#galleryImg:hover + a#prev { background-image: url(prev.png); } 
div#galleryImg:hover + a#prev + a#next { background-image: url(next.png); } 

當然，你要適應寬度和高度將圖像的正確尺寸，並把正確網址的影像。