调整IM Demo样式

This commit is contained in:
wanggeng 2021-09-14 11:43:58 +08:00
parent 52cfb14dae
commit 897e648b98

View File

@ -10,7 +10,7 @@
.websocket-container {width: 295px;}
.websocket-history-box {height: 400px; border: 1px solid silver; overflow: auto;}
.websocket-box {padding: 5px 0; text-align: right;}
.message {display: inline-block; max-width: 195px; font-size: 13px; margin: 10px; padding: 5px; border-radius: 5px;}
.message {display: inline-block; max-width: 195px; font-size: 13px; margin: 10px; padding: 5px; border-radius: 5px;word-wrap: break-word; word-break: normal;}
.receive-msg-box {}
.receive-msg {background-color: #04b304; color: #FFFFFF;}
.send-msg-box {text-align: right;}
@ -104,6 +104,7 @@
} else if(data.type === 101) {
var body = data.body;
$('#websocketHistoryBox').append('<div class="receive-msg-box"><div class="message receive-msg">'+ body +'</div></div>');
autoScrollBottom();
} else if(data.type === 1100) {
var body = JSON.parse(data.body);
$('#'+ data.id).before('<span class="send-status" title="'+ body.msg +'">!</span> ')
@ -161,7 +162,7 @@
websocket.send(JSON.stringify(sendBody));
$('#websocketHistoryBox').append('<div class="send-msg-box"><div id="'+ sendId +'" class="message send-msg">'+ $('#message').val() +'</div></div>');
$('#message').val('');
autoScrollBottom();
//
}
@ -174,6 +175,10 @@
$('#sendBox').hide();
}
function autoScrollBottom() {
var websocketHistoryBox = document.getElementById('websocketHistoryBox');
websocketHistoryBox.scrollTop = websocketHistoryBox.scrollHeight;
}
</script>
</body>