imgLoad(obj) { par = $(obj).parent();//取到img的父容器 par.prepend(str_html);//添加到img的上面 par.find(".div1").css("width", $(obj).css("width"));//设置容器的宽度和img一样 par.find(".div1").css("height", 100); var strs = $(obj).attr("src").split('http://www.cnblogs.com/'); var imgName = strs[strs.length - 1]; imgName = isc(imgName); $(obj).attr("name", imgName); msgKey[msgKey.length] = imgName; msgData[imgName] = ["test1:弹一下吧1", "test2:弹一下吧2", "test3:弹一下吧3", ]; setInterval(function () {//定时器 不断执行 par.find(".div11").each(function () {//取到所有的 评论文字 所在div mesgCycle(this, msgData[imgName]); }); }, "10"); }

图话“容器模版”

test:测试1 test3:test3

定时执行移动坐标：

mesgCycle(element, mesg) { var elementRight = parseInt($(element).css("left")); var elementWidth = parseInt($(element).css("width")); var imgWidth = parseInt($(element).parents(".div_pack").find("img").css("width")); $(element).css("left", elementRight - 1);((elementRight + elementWidth) == 0) {//如果完全容器 mesg[mesg.length] = mesg[0]; $(element).text(mesg.shift());//取下一条消息 $(element).css("left", imgWidth - parseInt($(element).css("width")));//重新设置初始坐标 $(element).css("color", getColor());//更好文字颜色 } }

好了，关键代码就这些了。下面给出全部源码。

首先，我并非专业前端。肯定有很多用的不合适和不合理的（我只是瞎折腾），希望园友给出更好的解决方案。如果您觉得此文对您有那么一点点用，请轻轻点个赞。

演示地址：

源码下载：

(注意：demo里面要设置你自己的 相册ID、AccessKey 和 SecertKey )

本文链接： 

欢迎上海“程序猿/媛”、"攻城狮"入群：【沪猿】229082941 入群须知