Fancybox 2 title hover on gallery change

╄→гoц情女王★ 提交于 2019-11-28 12:13:03

问题


First post, so apologies in advance.

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?

Example here http://www.richardbarry.co.uk/fancyhover.php

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

Any help much appreciated


回答1:


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'));
    });
  }
});

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



来源:https://stackoverflow.com/questions/14185451/fancybox-2-title-hover-on-gallery-change

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!