diff --git a/js/custom.js b/js/custom.js index f3fe023..67b75ba 100644 --- a/js/custom.js +++ b/js/custom.js @@ -2,12 +2,15 @@ var num = 0; var timer = null; var actionTimer = null; +var moveTimer = null; // 粉丝的昵称 var nameArr = ['鹅鹅鹅鹅鹅鹅','打嗝','旋风腿儿','霹雳腿儿','老寒腿儿','哇咔咔蹦跶']; // 粉丝说的话 var sayArr = ['没人','内容','空空风','美女姐姐','小阔爱','老阔爱']; // 动作 var actionArr = ['dancing-left','dancing-right','dancing-down','dancing-UP','dancing-Wobble','dancing-Wobble-right']; +// 人物位移动画 +var moveArr = ['run-right','run-left','run-right-top','run-left-top','run-right-bottom','run-left-bottom']; var peopleId = 0; // 集体舞 function allDancing(){ @@ -27,17 +30,6 @@ function allDancing(){ // 随机舞 function randomDancing(id){ actionTimer = setInterval(()=>{ - // var len = $('.dance-people').length; - // for (var i = 0; i < num; i++) { - // actionArr.forEach((item,index)=>{ - // // var chooseIdex = Math.floor(Math.random()*num); - // var haveDan = $(`.data${i} .people-img`).is(`.${item}`); - // if(haveDan){ - // $(`.data${i} .people-img`).removeClass(item); - // $(`.data${i} .people-img`).addClass(actionArr[Math.floor(Math.random()*actionArr.length)]); - // } - // }) - // } actionArr.forEach((item,index)=>{ // var chooseIdex = Math.floor(Math.random()*num); var haveDan = $(`.data${id} .people-img`).is(`.${item}`); @@ -46,9 +38,41 @@ function randomDancing(id){ $(`.data${id} .people-img`).addClass(actionArr[Math.floor(Math.random()*actionArr.length)]); } }) - console.log(id); },3000) } +// 随机位移 +function moveEv(id){ + var odiv = document.getElementById("peopleId0"); + actionTimer = setInterval(()=>{ + var end = `100% {-webkit-transform:rotate(90deg);opacity:1;}` + var s = document.styleSheets[0]; + moveArr.forEach((item,index)=>{ + // var chooseIdex = Math.floor(Math.random()*num); + var haveDan = $(`.data${id}`).is(`.${item}`); + if(haveDan){ + addCSSRule(document.styleSheets[ 0],`@keyframes ${item}`,`0%{transform:translate(${Math.floor(Math.random()*100)}%,${Math.floor(Math.random()*100)}%)}100%{transform:translate(${Math.floor(Math.random()*100)}%,${Math.floor(Math.random()*100)}%)}`,9) + } + }) + },5000) + // moveTimer = setInterval(()=>{ + // var speed = 1; + // if(odiv.offsetLeft>=700){ + // clearInterval(moveTimer); + // } else { + // odiv.style.left = odiv.offsetLeft+speed+'px'; + // } + // },10) + // console.log(23); +} +// 添加规则 +function addCSSRule(sheet,selector,rules,index){ + if("insertRule" in sheet){ + sheet.insertRule(selector+"{"+rules+"}",index); + console.log(selector+"{"+rules+"}"); + }else if("addRule" in sheet){ + sheet.addRule(selector,rules,index); + } +} // 关闭说话 function closeSay(index){ $(`.data${index} .speak`).addClass("dn"); @@ -58,12 +82,13 @@ function sayIng(index){ $(`.data${index} .speak`).removeClass("dn"); setTimeout(()=>{ closeSay(index); - },3000) + },6000) } -function peopleObj(name,say,action){ +function peopleObj(name,say,action,move){ // 开始说话 - sayIng(peopleId); + // sayIng(peopleId); randomDancing(peopleId); + // moveEv(peopleId); let yspHtml = ''; let yspData = [ { @@ -74,12 +99,13 @@ function peopleObj(name,say,action){ say:say,//说话内容 peopleImg:`people-img0${Math.floor(Math.random()*6+1)}`,//人物图片 ying_guang:`stick-0${Math.floor(Math.random()*5+1)}`,//荧光棒 - dancin:action + dancin:action, + peopleMove:move } ] $.each(yspData, function (commentIndex, comment) { yspHtml += ` -