Fix scroll position jumping when images load
Messages with images or media were causing the scroll position to jump around when they loaded, because rendering them changed the height of their elements from 0 to full-height sometime after they were inserted into the DOM. Now when rendering attachments, we wait for them to load so they can render at full height immediately, then warn our parent message list before and after a potential height change, so the scroll position can be saved and reset. // FREEBIE
This commit is contained in:
parent
2ee8cae8d4
commit
2fc78ddd7d
7 changed files with 61 additions and 54 deletions
|
@ -94,16 +94,19 @@
|
|||
this.renderSent();
|
||||
this.renderDelivered();
|
||||
this.renderErrors();
|
||||
|
||||
this.$('.attachments').append(
|
||||
this.model.get('attachments').map(function(attachment) {
|
||||
return new Whisper.AttachmentView({
|
||||
model: attachment
|
||||
}).render().el;
|
||||
})
|
||||
);
|
||||
this.loadAttachments();
|
||||
|
||||
return this;
|
||||
},
|
||||
loadAttachments: function() {
|
||||
this.model.get('attachments').forEach(function(attachment) {
|
||||
var view = new Whisper.AttachmentView({ model: attachment }).render();
|
||||
this.listenTo(view, 'update', function() {
|
||||
this.trigger('beforeChangeHeight');
|
||||
this.$('.attachments').append(view.el);
|
||||
this.trigger('afterChangeHeight');
|
||||
});
|
||||
}.bind(this));
|
||||
}
|
||||
});
|
||||
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue