fancyBox2：幻灯片按钮和图像边框

是否可以只有幻灯片开/关按钮和位置 标题区域内的某个地方？我想要这个的原因是 因为按钮栏缩小了显示图像的大小，我只想有这个选项 打开或关闭幻灯片，导航通过正常的左右方向完成 单击图像。

是否可以减少图像周围的边框，尤其是底部边框？我尝试了填充和边距的设置，但得到了一些意想不到的结果。有没有例子 确切语法的任何地方？

Thanks

mcl

您可能需要创建自己的播放/暂停按钮。就我而言，我使用以下 css 从 fancybox 按钮 (helpers/fancybox Buttons.png) 创建了它们：

a.myPlay {
 /* set the proper path to the png file */
 background-image:  url("fancybox2.0.4/helpers/fancybox_buttons.png");
 background-color: #2a2a2a;
 background-repeat: no-repeat;
 display: block;
 line-height: 30px;
 text-indent: -9999px;
 width: 30px;
 height: 30px;
 float: left; 
 margin-right: 20px;
}
a.myPlay {
 background-position: 0 -30px;
}
a.myPlayON {
 background-position: -30px -30px;
}

以及一些额外的（内联CSS）样式应用于fancybox-title类来调整我的title（选修的）：

.fancybox-title {
 min-height: 30px;
 line-height: 30px;
}

然后执行该技巧的脚本（helpers and afterLoad是要设置的重要选项）：

$(document).ready(function() {
 $(".fancybox").fancybox({
  nextEffect : 'fade',
  prevEffect : 'fade',
  openEffect : 'fade',
  closeEffect : 'fade',
  closeBtn : 'true',
  arrows : 'true',
  helpers : { 
   title : { type : 'inside' }
  },
  afterLoad: function(){
   if($.fancybox.player.isActive){ 
    this.title = '<a href="javascript:$.fancybox.play();" title="Slideshow" class="myPlay myPlayON" onclick="$(\'.myPlay\').toggleClass(\'myPlayON\')">pause</a> Image ' + (this.index + 1) + ' of ' + this.group.length + (this.title ? ' - ' + this.title : '');
   } else {
    this.title = '<a href="javascript:$.fancybox.play();" title="Slideshow" class="myPlay" onclick="$(\'.myPlay\').toggleClass(\'myPlayON\')">play</a> Image ' + (this.index + 1) + ' of ' + this.group.length + (this.title ? ' - ' + this.title : '');
   } // if else
  } // afterLoad
 }); //fancybox
}); // ready

请记住你仍然需要加载 fancybox 的按钮 js 和 css 文件无论您没有使用helpers > buttons option.

一个正在工作的演示在这里 http://picssel.com/playground/jquery/playButtoninTitle_10mar12.html。使用风险自负；）