javascript - Bootstrap ekko Lightbox 显示奇怪的字符

Question

我尝试实现这个用于引导的灯箱插件:http://ashleydw.github.io/lightbox/

这是缩略图链接图像的 html

<a href="/img/21/1920" data-toggle="lightbox">
 <img align="right" src="/img/21/200">
</a>

图像已显示，如果我单击它，则会出现模式窗口，但模式窗口看起来不太正确。

如果我直接访问/img/21/1920它在浏览器中显示应有的样子，没有问题，我还可以创建一个 <img>带有正确显示的 src-url 的标记。

所以这似乎是该模式插件特有的东西。当检查弹出模式的 HTML 时，这就是所显示的..对我来说，它似乎缺少一些东西，一个 <img>也许是标签。但我找不到任何设置或其他关于我做错了什么的信息..

所以。我做错了什么导致了这个？

编辑以显示返回图像的代码

public ActionResult GetImageSmall(int Id, int MaxWidth = 550)
{
    var file = _Context.Files.Where(x => x.Id == Id).SingleOrDefault();//.Select(s => s.ImageFile).SingleOrDefault();

    if (file.IsImage == false)
        return null;

    if (file != null)
    {
        FileManager fm = new FileManager();
        var filePath = fm.GetRealPathOfFile(file.Path);

        if (System.IO.File.Exists(filePath))
        {
            ImageHandler ih = new ImageHandler();
            string tempPath = ih.GetTempImagePath(file.Id, file.Extension, filePath, MaxWidth, _Context);
            return File(tempPath, HelperMethods.GetMimeType(System.IO.Path.GetExtension(tempPath)));
        }
    }
    return null;
}

上面的代码从数据库中获取所需的图像路径，并将其调整为所需的大小以节省带宽。我可能有一个 3k x 3k 大小的图像，这将根据 url 路径变量以更易于管理的大小返回它。正如我之前所写，url 可以在 <img> 中使用标签或直接浏览没有问题。该方法的url是/img/{Id}/{MaxWidth}/

根据原始文件扩展名返回Mimetypes，如:

{".jpe", "image/jpeg"},
{".jpeg", "image/jpeg"},
{".jpg", "image/jpeg"},

Answer 1

将类型参数设置为图像解决了我的问题。如果 urlpath 不包含扩展名，灯箱插件似乎无法确定其图像(即使正在发送正确的 mimetypes)。

<a href="/img/22/1920" data-toggle="lightbox" data-type="image">
<img src="/img/22/100">
</a>