-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ファイルから矢印を追加したいと思います。これを行う方法(クリックすると画像が変わります)

4

1 に答える 1

0

これがあなたが望むものであるかどうかよくわからないときにホバーするときにあなたのとが矢印を持っているべきだa#prevと言うつもりだったと仮定すると、これに似たものを使用して純粋なcssでそれを行うことができます:a#nextdiv#galleryImg

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を設定する必要があります。

于 2012-09-17T11:15:28.433 に答える