HTML5仿手机微信聊天界面

.content li span.spanleft { float: left;

background: #fff; }

.content li span.spanright { float: right;

background: #7cfc00; }

</style> <script>

window.onload = function(){ var arrIcon = ['http://www.xttblog.com/icons/favicon.ico','http://www.xttblog.com/wp-content/uploads/2016/03/123.png'];

var num = 0; //控制头像改变 var iNow = -1; //用来累加改变左右浮动

var icon = document.getElementById('user_face_icon').getElementsByTagName('img'); var btn = document.getElementById('btn');

var text = document.getElementById('text'); var content = document.getElementsByTagName('ul')[0];

var img = content.getElementsByTagName('img'); var span = content.getElementsByTagName('span');

icon[0].onclick = function(){

if(num==0){ this.src = arrIcon[1];