MVC3 在视图中预加载许多图像答案

【问题标题】：MVC3 Pre-Loading many images in viewMVC3 在视图中预加载许多图像
【发布时间】：2011-12-22 20:22:03
【问题描述】：

这是在 C#、asp.net 4.0、带有 razor 标签的 MVC3 中完成的

我的相册每张最多有 9 张图片。图片保存在文件系统上并由数据库管理。我可以在我的控制器中构建整个对象并将其传递到包含专辑所有数据库信息的视图中。但是，在初始页面加载时，可能会预加载数百张图像（这是在视图中完成的，而不是在控制器中完成的）——即使这意味着所有图像都会立即呈现。我的页面设计是这样的，有一个图像滑动窗口，然后根据滑动窗口中的选择在页面下方显示相册。

a) 我应该什么时候预加载或缓存这些图像？

b) 我应该使用 javascript 来预加载还是应该使用 MVC3 的某些结构来预加载/缓存图像？

我要做的是在滑动窗口移动到新专辑时制作动画，并且在动画期间我将预加载专辑的图像，但我愿意接受替代方案或建议，并会非常感谢任何想法。

谢谢

【问题讨论】：

标签： c# javascript asp.net-mvc asp.net-mvc-3 razor

【解决方案1】：

我建议沿着 JS 路径走，这将允许您加载整个页面，然后您可以触发加载图像，这样页面在加载时仍然有用。

您可以对图像执行类似操作，将 # 替换为加载 gif 的链接。

<img src="#" delayed="http://mydomain.com/myimage.png"/ >

页面加载完成后在 JQuery 中

$('img').each(function(){ $(this).attr('src', $(this).attr('delayed')); });

这会将延迟的图像路径交换到 src 并导致图像被加载。

曾经有一个 jquery 插件可以做到这一点，但上次我看它坏了。

编辑：looks like it has been updated

【讨论】：

我最终选择了 JS 路线，但更多的是重新发明轮子的策略。老实说，其他轮子不适合我的轮胎。