Chrome/Safari for Mac 中的 Jquery Cycle 问题或 css 问题
您好，我使用 jquery Cycle 插件创建了多个简单的滑动画廊。在 Mac 上的 Chrome/Safair 中，浏览器无法加载图像。
这是我正在使用的js的 ，尽管它可能是一个CSS问题。 .?我正在努力寻找真正的问题。
$(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>
任何帮助将不胜感激。谢谢
Hi i have used the jquery cycle plugin to create multiple simple sliding galleries. In Chrome/Safair on Mac the browser is not loading the images.
Here is the link
the js i am using is here, although it could be a css issue..? I am struggling to find the real problem.
$(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;
}
Markup:
<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>
Any help would be appreciated. thanks
如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
发布评论
评论（3）
这里有很多人报告了此问题：
http:// /code.google.com/p/chromium/issues/detail?id=113556
不幸的是，还没有解决方案，但它已经重新创建，我也这样做了。
只是一些信息
This issue has been reported by a very large number of people here:
http://code.google.com/p/chromium/issues/detail?id=113556
Unfortunately no resolution yet, however it has been re-created and I have done so as well.
Just some info
没有 Mac，但 Firebug 显示：
这有帮助吗？
Haven't got a Mac but Firebug displays:
Does this help?
看来是为我工作。在 Mac 和 FF 上检查了 chrome...还有问题吗？
Looks to be working for me. Checked in chrome on a Mac and FF...still ahving issues?