2012-09-17 297 views
-1

我得到這個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文件上的圖像添加箭頭時,懸停。如何做到這一點(現在的形象正在改變點擊)

回答

0

假設你的意思是說,你的a#preva#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); } 

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