本文共 3368 字，大约阅读时间需要 11 分钟。

1、html

2、脚本

//demandList    /*冒泡效果*/    var paoWidth= $(window).width();    var paoHeight = $("#carousel-inner img").height();    var bubbleCreator = {        init: function () {
               var self = this;            self.container = document.querySelector(".labels");            self.bubbles = [];            self.add("root");            return self;        },        add: function (str) {
               var self = this;            var oa = document.createElement('a');            oa.setAttribute("class", "paopao");            oa.setAttribute("data-moving", 1);            oa.setAttribute("data-step-speed", 1.22222);            oa.innerText = str;            self.setNewPos(oa);            oa.addEventListener("mouseenter", function (e) {
                   this.setAttribute("data-moving", "0");            });            oa.addEventListener("mouseout", function (e) {
                   this.setAttribute("data-moving", "1");            });            self.container.appendChild(oa);            self.bubbles.push(oa);            self.resetContent(oa);            return self;        },        resetContent: function (ele, str) {
               var self = this;            self.setNewPos(ele);            //ele.innerText = str ? str : ele.innerText;            ele.setAttribute("data-step-speed", 1 + Math.random());            $(ele).fadeIn();            $(ele).css({                width: "0px",                height: "0px",                fontSize: "0px",                birderRadius: "50%",                lineHeight: "0px"            });            $(ele).animate({                width: "80px",                height: "80px",                fontSize: "18px",                birderRadius: "50%",                lineHeight: "80px"            },2000);            return self;        },        setNewPos: function (ele) {
               ele.style.top = paoHeight + (parseInt(Math.random() * 10) * 2) + "px";            ele.style.left = Math.round(Math.random() * (paoWidth-80) + 80) + "px";            return this;        },        move: function () {
               var self = this;            self.bubbles.forEach(function (e) {
                   var currentTop = parseInt(e.style.top);                var isMoving = e.getAttribute("data-moving") == 1;                var stepSpeed = e.getAttribute("data-step-speed");                if (isMoving) {                    e.style.top = (currentTop - stepSpeed) + "px";                    if (currentTop - 2 <= 0) {                        self.resetContent(e, e.innerText);                        if (self.bubbles.length < 8)                             self.add(self.bubbles.length)                    }                }            });        },        start: function () {
               var self = this;            self.move();            var tid = setInterval(function () {
                   self.move();            }, 10);        }    };    bubbleCreator.init().start();

—————————————————————————————————————————————————–

java架构师项目实战,高并发集群分布式,大数据高可用视频教程，共760G

下载地址：

https://item.taobao.com/item.htm?id=562739965822

01.高级架构师四十二个阶段高

转载地址：https://lovoo.blog.csdn.net/article/details/78510866 如侵犯您的版权，请留言回复原文章的地址，我们会给您删除此文章，给您带来不便请您谅解！