javascript - 在 fancybox 中加载各种尺寸的图像

Question

我有 5-6 张不同尺寸的图像，例如宽度从 1000 像素到 1048 像素，高度从 593 像素到 1736 像素。但它不加载小图像。我试图传递宽度和高度，但它不起作用。

HTML

<a class="fancybox" href="images/press/creating websies for NGOS.png" data-fancybox-group="gallery" title="Creating websites for NGOs" data-width="1048" data-height="593">
    <img src="images/press/creating websies for NGOS.png" style="border:0" alt="">
</a>

JQUERY

$(".fancybox").fancybox({
        beforeShow: function () {
        this.width  = $(this.element).data("width");
        this.height = $(this.element).data("height");
        }
});

那么怎么做呢。它将根据从 html 传递的宽度和高度加载。伙计们有什么想法吗？

Answer 1

问题

您当前的网址是

http://firstplanet.in/about/feature.php/

并且您的图片链接到

images/press/commitment to unemployment.png

扩展为

http://firstplanet.in/about/feature.php/images/press/creating%20websies%20for%20NGOS.png

将您的图片链接更改为

/about/images/press/commitment to unemployment.png

让他们工作。

更多信息

阅读本文 on relative URLs .这是摘录。

不在 / 之前

If the image has the same host and the same path as the base document:

http://www.colliope.com/birdpics/owl/pic01.jpg
http://www.colliope.com/birdpics/owl/page.html

We would write < img src="pic01.jpg" >

前置一个/

If the image has the same host but a different path:

http://www.colliope.com/gifs/groovy14/button.gif
http://www.colliope.com/birdpics/owl/page.html

We would write < img src="/gifs/groovy14/button.gif" >