2012-04-04 16 views
0

私は、スライダーjqueryのnivoテンプレートを使用して画像付きのジアバラマを作成します。 私の問題は、最初の画像を正しく表示し、次に2番目の画像を最初の画像に表示していますが、垂直方向には40pxのwidhtで表示していることです。 私は同じ時間に2つの画像を持っています。最初は正しいサイズで2番目の画像はありません。 私は何をしなければならないか知っていますか?image with nivo slider jquery

これは私のコードの私の一部です:

<style> 
.nivoSlider { 
    position:relative; 
    width:618px; /* Change this to your images width */ 
    height:246px; /* Change this to your images height */ 
    background:url(images/loading.gif) no-repeat 50% 50%; 
} 
.nivoSlider img { 
    position:absolute; 
    top:0px; 
    left:0px; 
    display:none; 
} 
.nivoSlider a { 
    border:0; 
    display:block; 
} 
</style> 
<script type="text/javascript"> 
$(window).load(function() { 
    $('#slider').nivoSlider(); 
}); 
</script>  
<div id="slider" class="nivoSlider"> 

    <img src="/template/images/custom/popup_imgtest.jpg" alt="" /> 
    <img src="/template/images/custom/popup_imgtest2.jpg" alt="" /> 
    </div> 

答えて

1

私はあなたの問題は、あなたがそれは精巧な効果だためnivoSliderが作成したスライスのスタイルを欠けていることだと思います。

これらは、nivoSliderをダウンロードするとすぐに入手できるzipファイルです。

/* The slices and boxes in the Slider */ 
.nivo-slice { 
    display:block; 
    position:absolute; 
    z-index:5; 
    height:100%; 
} 

.nivo-box { 
    display:block; 
    position:absolute; 
    z-index:5; 
} 

これはあなたのスタイルブロックに追加したもので、コードは私のために働いていました。お役に立てれば。

関連する問題