jQuery的图像预览,关于AJAX内嵌图片的链接工作?(jquery image preview

2019-11-02 18:29发布

有各种各样的好jQuery的图像预览插件在那里。 然而,所有我测试还没有的那些工作的上埋设于阿贾克斯的DOM图片链接。

我已经测试使用jQuery Live功能,但它不工作完美无瑕。

$('a.preview').live('mouseover', function() {
    $(this).imgPreview({
        imgCSS: {
            //width: '200px'
        },
        preloadImages:      'true',
    });
});

即时通讯使用这一个: http://www.webresourcesdepot.com/jquery-image-preview-plugin-imgpreview/

问题是,我必须使用jQuery的生活如u见上面。 但有2个缺陷。

  1. 如果我第一次它不显示预览将鼠标移到缩略图,我想这是因为我处理不当获取的图像呢。 所以我要再次移动鼠标从图片上移开并返回到图像,然后它会被显示。 这是非常烦人。

  2. 它不预载的图片。 如果你检查自己的网站,他们使用的是像这样,而不是:

    $( 'a.preview')imgPreview({preloadImages: '真',});

并且,将所有预加载预览DOM完全加载后。 但我已经封装的功能。 但即使我没有,它不能引起我添加这些图像链接与阿贾克斯DOM后加载。

我不知道是否有人知道一个插件,可以做AJAX加载内容,预览和预载同样的东西。

谢谢。

Answer 1:

它增加了鼠标悬停不会帮助,因为整个的一点是预载的图片,他们得到鼠标悬停在此之前......(让他们可在鼠标悬停)..

你应该添加$('a.preview').imgPreview(...)你装上新的链接(从阿贾克斯)到DOM之后..



Answer 2:

使用相同的插件,使用Ajax这项工作完美:

.
.
.
$.post("ajax/showAlbum.php", { directory: "whatever" },
   function(data) {$('#first').append(data);
$('#first a').imgPreview({
    preloadImages:      'true',
    });
.
.
.


文章来源: jquery image preview that work on ajax embedded image links?