效果圖：

思路：

當鼠標在頁面上移動時，動態創建一個小圓點(位置就是鼠標的當前位置)。一秒后，再把該圓點刪除掉。僅需要js代碼就能實現

代碼：

<script>//鼠標移動時，動態創建div,一秒后刪除window.onmousemove = function(event){var nDiv = document.createElement('div') //創建新的divvar e = event || window.event //獲取事件對象//設置div的樣式(紅色小圓點)和位置(鼠標當前位置)nDiv.style.cssText = "position:absolute; width:5px; height:5px; background-color:red; border-radius:50%" nDiv.style.left = e.pageX + "px"nDiv.style.top = e.pageY + "px"//把創建好的div添加到body里面document.body.appendChild(nDiv)//延遲定時器實現一秒后刪除效果setTimeout(function(){nDiv.remove();},1000)}</script>

如有疑問，歡迎下方留言！

總結

以上是生活随笔為你收集整理的JavaScript动态显示鼠标移动轨迹的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。