Fancybox 2标题悬停在画廊变更上 [英] Fancybox 2 title hover on gallery change

问题描述

第一篇文章，所以提前致歉.

First post, so apologies in advance.

我正在使用这个 如何仅在图像悬停时显示fancybox标题 它可以使您满意，除了单击上一个/下一个并且光标已经在悬停时，标题不会出现-您必须悬停并再次返回.

I'm using this How to display fancybox title only on image hover and it works a treat, except when you click prev/next and the cursor is ALREADY hovering, the title doesn't appear - you have to hover out and back in again.

如果您在图像加载时已经将鼠标悬停了，有什么想法可以使标题显示?

Any idea how to make the title appear if you're already hovering when the image loads?

这里的例子 http://www.richardbarry.co.uk/fancyhover.php

它在fancybox 1中起作用，像这样- http://www.richardbarry.co.uk/gallery.php

It worked in fancybox 1, like this- http://www.richardbarry.co.uk/gallery.php

非常感谢任何帮助

推荐答案

作为一种解决方法，您可以尝试添加一个函数来检测鼠标是否已经在fancybox内容上悬停，如

As a workaround, you may try adding a function to detect if the mouse is already hovering the fancybox content as in this post .... then show the fancybox title if so.

$(".fancybox").fancybox({
  helpers: {
    title: {
      type: 'over'
    }
  },
  afterShow: function () {
    $(".fancybox-title").hide();
    // shows/hides title on hover
    $(".fancybox-wrap").hover(function () {
      $(".fancybox-title").stop(true, true).slideDown(200);
    }, function () {
      $(".fancybox-title").stop(true, true).slideUp(200);
    });
    // detects if mouse is already hovering
    $(".fancybox-outer a, .fancybox-outer img").hover(function () {
      $(this).data('timeout', setTimeout(function () {
        $(".fancybox-title").stop(true, true).slideDown(200);
      }, 100));
    }, function () {
      clearTimeout($(this).data('timeout'));
    });
  }
});

请参见 JSFIDDLE ……在IE7 +和FF

See JSFIDDLE ... it seems to work fine in IE7+ and FF

这篇关于Fancybox 2标题悬停在画廊变更上的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！