[英]Meteor: onRendered event on image possible?
我想检查图像是否已满载。 所以我在模板上使用带有图像的onRendered
:
模板
<template name="backgroundImage">
<img class="bg blur" src="{{image}}">
</template>
帮手
Template.backgroundImage.helpers({
image: function() {
return '/images/background_1.jpg';
}
});
事件
Template.backgroundImage.onRendered(function() {
console.log('image loaded, start fadeOut on overlay');
});
我现在的问题是,这真的有效吗? 在图像加载时onRendered
发生火灾还是只是加载html时它会激活?
我的目标是在图像完全加载后,使用加载动画淡化叠加。 用户应该在(!)图像加载后看到页面的内容。
onRendered
只会在HTML img
标记呈现给DOM后触发,但它不会等到图像实际完全加载。
您可以使用load
事件来检查:
Template.backgroundImage.events({
'load img'(event, template) {
console.log(template.$('img').prop('width'));
},
});
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.