网站动态背景线条跟随鼠标移动，吸附鼠标效果代码

最新推荐文章于 2025-06-26 14:30:42 发布

原创

最新推荐文章于 2025-06-26 14:30:42 发布 · 2.2w 阅读

54 ·

CC 4.0 BY-SA版权

文章标签：

#js代码 #鼠标跟随代码 #动态线条背景代码

经常看到有些SEO博客网站上有这种用动态线条作为网站背景的效果，当鼠标移动上去的时候会出现线条吸附在鼠标周围的特效，鼠标离开的时候线条就自动散开。这个效果之前在我的博客上也有加过，后来网站改版就没有继续用了，其实效果还是挺不错的。这种网站动态背景线条跟随鼠标移动，吸附鼠标效果代码是用JS来实现的，代码如下，喜欢的朋友可以为自己的博客添加。添加方法：将下方代码复制到网站想添加线条跟随鼠标移动效果的页面</body>上方或添加到网站底部模板文件 foot.htm 里面，如果不喜欢页面代码太多，也可以写到JS文件里来进行调用。

动态背景线条跟随鼠标移动代码如下：

<!--代码放置于</body>上方-->

<script>

!function(){

function n(n,e,t){

return n.getAttribute(e)||t

}

function e(n){

return document.getElementsByTagName(n)

}

function t(){

var t=e("script"),o=t.length,i=t[o-1];

return{

l:o,z:n(i,"zIndex",-1),o:n(i,"opacity",.5),c:n(i,"color","0,0,0"),n:n(i,"count",99)

}

}

function o(){

a=m.width=window.innerWidth||document.documentElement.clientWidth||document.body.clientWidth,

c=m.height=window.innerHeight||document.documentElement.clientHeight||document.body.cli