我在博客网站上使用过jQuery cycle2插件。我想要的幻灯片所做的是，当有一个以上的图像显示，控件将显示-在那一刻，他们是隐藏的通过css。
这个插件是通过在我的头文件中声明它来使用的(这里是指向js文件的链接：http://malsup.github.com/jquery.cycle2.js
然后我的css包含一个用于幻灯片容器的类，一个用于按钮容器的类，以及一个分别用于上一步和下一步按钮的类：
css：
.cycle-slideshow {
height:400px;
z-index:0;
}
.cycle-slideshow img{
width:100%;
height:100%;
z-index:3;
}
.center {
display:none;
}
.center a{
z-index:4;
position:absolute;
margin-top:-48px;
}
.center a:hover {
display:block;
}
.center a#prev, .center a#next{
position:relative;
width:4%;
height:60px;
width:60px;
margin-top:-60px;
font-size:40px;
text-align:center;
color:#FFF;
}
.center a#next{
float:right;
background:url(images/next.png) center -2px no-repeat;
}
.center a#prev {
float:left;
background:url(images/prev.png) center -2px no-repeat;
}我的html代码实际上是嵌入在一个wordpress函数中的，但是html格式是这样的：
<div class="cycle-slideshow"
data-cycle-fx="scrollHorz"
data-cycle-pause-on-hover="true"
data-cycle-speed="200"
data-cycle-next="#next"
data-cycle-prev="#prev"
data-cycle-swipe="true">
//does stuff here
</div>
<div class="center">
<a href="javascript:void(0);" id="prev"> </a>
<a href="javascript:void(0);" id="next"> </a>
</div>下面的代码我被告知要做(前三行)，但这似乎仍然不起作用。
$(document).ready(function () {
$('.cycle-slideshow').on( 'cycle-initialized', function( e, opts ) {
if ( opts.slideCount > 1 ) {
$(".center").css("display", "block");
}
});
});我不是最好的jQuery，所以有谁可以帮助我或给我任何指导吗？
回答 1
Stack Overflow用户
发布于 2013-04-09 20:59:29
在这种情况下，您需要在添加事件处理程序之后通过代码初始化幻灯片。删除cycle-slideshow类，使其不会自动初始化，然后您可以执行以下操作：
演示：http://jsfiddle.net/lucuma/zyhrK/1/
$('.slideshow').on('cycle-initialized', function (e, opts) {
if (opts.slideCount > 1) {
$(".center").css({
"display": "block"
});
}
});
$('.slideshow').cycle();页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/15573852
复制相关文章
相似问题
从布局目录运行MasterPages
从UIScrollview中删除内容和帧布局指南
Android布局指南
嵌套MasterPages
关于SharePoint 2010的所有内容(控件、WebParts、主题、MasterPages)
添加站长 进交流群
领取专属 10元无门槛券
AI混元助手 在线答疑
关注 腾讯云开发者公众号
洞察 腾讯核心技术
剖析业界实践案例
腾讯云开发者
