こんにちは、jquery サイクル プラグインを使用して複数の単純なスライド ギャラリーを作成しました。Mac の Chrome/Safair では、ブラウザが画像をロードしていません。
リンクはこちら
CSSの問題かもしれませんが、私が使用しているjsはここにあります..? 私は本当の問題を見つけるのに苦労しています。
$(document).ready(function() {
$('.slides').each(function() {
var $this = $(this), $ss = $this.closest('.slideshow');
var prev = $ss.find('a.prev'), next = $ss.find('a.next');
$this.cycle({
prev: prev,
next: next,
fx: 'scrollLeft',
speed: 'fast',
timeout: 0
});
});
});
CSS
.slideshow {
width:476px;
height:287px;
float:left;
margin-right:30px;
position:relative;
z-index:0;
margin-bottom:20px;
}
.slides {
position:absolute;
top:0;
left:0;
z-index:1;
}
a.prev {
display:block;
width:23px;
height:22px;
background:red;
position:absolute;
z-index:1000;
background: url(../images/next_prev.png) no-repeat 0 0;
top:133px;
left:-11px;
}
a.next {
display:block;
width:23px;
height:22px;
background:red;
position:absolute;
z-index:1000;
background: url(../images/next_prev.png) no-repeat -23px 0;
top:133px;
right:-11px;
}
マークアップ:
<div class="slideshow">
<div class="slides">
<img src="images/chief_st_1.jpg" alt="CHIEF stationery + literature" />
<img src="images/chief_st_3.jpg" alt="CHIEF stationery + literature" />
<img src="images/chief_st_2.jpg" alt="CHIEF stationery + literature" />
</div>
<a class="prev" href="#"></a> <a class="next" href="#"></a>
</div>
どんな助けでも大歓迎です。ありがとう