js请问怎么让每个li运动轨迹不同随机移动并且不会在边缘上下滑动？

JavaScript024

js请问怎么让每个li运动轨迹不同随机移动并且不会在边缘上下滑动？,第1张

window.onload=function(){

    var btn=document.getElementById("btn")

    var odiv=document.getElementById("div")

    var ali=odiv.getElementsByTagName("li")

    var w = document.documentElement.clientWidth

    var y = document.documentElement.clientHeight

    var directionX = []

    var directionY = []

    for(var i=0 i<ali.length i++){

        directionX.push(true)

        directionY.push(true)

    }

    var t=null

    btn.onclick=function(){

        clearInterval(t)

        t=setInterval(function(){

            for(var i=0 i<ali.length i++){

                var speedx=Math.floor(Math.random()*50 + 5)

                var speedy=Math.floor(Math.random()*18 + 8)

                

                var l = directionX[i] ? ali[i].offsetLeft+speedx : ali[i].offsetLeft-speedx

                var t = directionY[i] ? ali[i].offsetTop+speedy : ali[i].offsetTop-speedy

                

                if(0 < l && l <= w-ali[i].offsetWidth){

                    ali[i].style.left=l+"px"

                }

                else

                    directionX[i] = !directionX[i]

                if(0 < t && t < y-ali[i].offsetHeight){

                    ali[i].style.top=t+"px"

                }

                else

                    directionY[i] = !directionY[i]

            }

        },10)

    }

}

当前迭代的元素:${o.ord_code} 当前迭代的元素:${st.current.ord_code} 当前迭代的索引:${st.index} 迭代计数:${st.count} 是否是第一次迭代:${st.first} 是否是最后次迭代:${st.last}