好吧,所以我有一个页面加载到div的图像,但它发生在一秒钟后。该图像有一些与它相关的描述和故事,也加载但速度更快。实际上,描述在屏幕顶部加载,然后在图像加载完成时“移动”。显然这是不好的。我希望即使图片尚未加载,说明也会加载到图片加载后的预期位置。加载html图像说明div在指定的高度前后图像加载
结构为:
<div image />
<div description />
请帮帮忙,所以我可以回家过周末;)
好吧,所以我有一个页面加载到div的图像,但它发生在一秒钟后。该图像有一些与它相关的描述和故事,也加载但速度更快。实际上,描述在屏幕顶部加载,然后在图像加载完成时“移动”。显然这是不好的。我希望即使图片尚未加载,说明也会加载到图片加载后的预期位置。加载html图像说明div在指定的高度前后图像加载
结构为:
<div image />
<div description />
请帮帮忙,所以我可以回家过周末;)
有几种方法可以解决你的问题。我建议你阅读this article。在那里你会找到一个完全适合你需求的解决方案。至少它会降低图像明显跳跃
可以显示的说明时加载图像 - 检测它以这种方式使用jQuery:
$("#image").load(function(){
alert("Image loaded!");
});
看到this answer为deails
是的,我在那条路线上思考,但事实证明,以绝对的方式加载描述要简单得多,它最终应该放在哪里。感谢您的建议。 – zalenix
你甲肝È两种可能性(据我看到):
是的,你是部分正确的 - 描述也应该加载到它的工作绝对定位。 – zalenix
一种方法是添加样式信息到描述标签:
style="position: absolute; top: 1000px;"
这里的1000像素是实际图像的高度。这将确保描述在上边距下方1000像素处加载,为图像留出1秒后加载的空间,而不会移动描述。
我也能回家;) – zalenix
谢谢!这篇文章也做了一些类似于我的想法。检查我的答案。 – zalenix