jquery - 在滑块上添加导航

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#prevanda#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); }

当然，您应该根据图像的正确尺寸调整宽度和高度，并为图像设置正确的 url。