Question

我正在尝试将FancyBox 2.0.6用于由图像映射中的链接触发的图像弹出窗口。这些图像应显示为带有按钮和缩略图的幻灯片，并且灯箱上没有关闭按钮。

这是我试过的......

我为fancybox声明了一个类，如下所示

<script type="text/javascript">
   $(document).ready(function() {
      $('.fb_imagemap').fancybox({
         padding : 0,
         openEffect : 'fade',
         openSpeed : 300,
         closeEffect : 'fade',
         closeSpeed : 300,
         prevEffect : 'fade',
         prevSpeed : 300,
         nextEffect : 'fade',
         nextSpeed : 300,
         closeBtn : false,
         arrows : false,
         nextClick : true,
         helpers : {
            title : {
               type : 'over'
            },
            buttons : {},
            thumbs : {
               width : 50,
               height : 50
            },
            overlay : {
               speedIn : 300,
               opacity : 0.80
            }
         },
      });
   });
</script>

然后，对于实际的图像映射，我定义了以下HTML：

<div style="text-align:left; width:612px; margin-left:auto; margin-right:auto;">
    <img id="MappedImage" src="4_big.jpg" usemap="#ImageMap" border="0" width="612" height="612" alt="" />
    <map id="ImageMap" name="ImageMap">
       <area shape="rect" coords="0,0,306,306" href="1_big.jpg" alt="" title="Image 1" class="fb_imagemap" rel="group1" />
       <area shape="rect" coords="307,0,612,307" href="2_big.jpg" alt="" title="Image 2" class="fb_imagemap" rel="group1" />
       <area shape="rect" coords="0,306,306,612" href="3_big.jpg" alt="" title="Image 3" class="fb_imagemap" rel="group1" />
       <area shape="rect" coords="307,307,612,612" href="4_big.jpg" alt="" title="Image 4" class="fb_imagemap" rel="group1" />
    </map>
</div>

当我现在点击图像地图中的一个链接时，一个带有关闭按钮的灯箱正在打开，显示链接的图像。

上面代码中指定的大多数设置都因某些原因被忽略：

设置中未显示任何按钮。
设置中未显示任何缩略图设置。
虽然我在设置中将其关闭，但仍显示关闭按钮。
图像未分组（请参阅常用rel属性“group1”）
由于图像显然没有分组，因此没有幻灯片显示。

现在我的问题：为了打开由图像映射发出的图像作为带有缩略图和按钮的幻灯片放映而没有设置中指定的关闭按钮，我需要做些什么才能使其工作？

非常感谢提示或 - 甚至更好 - 一个有效的例子......; - ）

最佳，

Jeeosch

FancyBox 2.0.6和图像映射问题

0 个答案: