首页
友情链接导航
图片壁纸
视频电视
更多
直播
关于
推荐
梦屿导航
Search
1
了解网络攻击
145 阅读
2
宝塔面板登录界面添加图片背景
125 阅读
3
欢迎来到梦屿博客
102 阅读
4
宝塔 Linux 面板 7.9.2 开心版 - 2022年6月4日更新
82 阅读
5
60秒读懂世界
64 阅读
梦屿个人状态
活动分享
技术交流
网络安全
编程相关
登录
/
注册
Search
标签搜索
ssl
黑客
术语
DDoS攻击
网络攻击
网络知识
腾讯云
电脑小知识
仙梦奇缘
IP伪造
鼠标点击特效
防止ssl泄露源ip
圣诞节
小霸王游戏机
虚拟主机
CDN
宝塔面板
梦屿
v2
中暑了怎么办
梦屿
累计撰写
20
篇文章
累计收到
6
条评论
首页
栏目
梦屿个人状态
活动分享
技术交流
网络安全
编程相关
页面
友情链接导航
图片壁纸
视频电视
直播
关于
推荐
梦屿导航
搜索到
1
篇与
的结果
2022-07-05
wordpress鼠标点击特效
不知大家有没有看到过别人的博客页面,鼠标每一次点击都会有文字出来然后慢慢移动消失,是不是觉得很炫酷,下面就带着大家给自己的博客添加这种效果。首先,打开正在使用主题中的footer.php文件复制下面的代码,然后放在[code lang="php"]<?php wp_footer(); ?>[/code]的上面,注意不要放错位置。(在最下面)[code lang="js"]<script> /* 鼠标特效 */ /* 站点:梦屿博客 作者:梦屿 网址:https://blog.mengyu.ltd */ var a_index = 0; window.onload=function(){ var bo = document.getElementsByTagName("body")[0]; bo.onclick = function(e){ var e = e || window.event; var x = e.pageX; var y = e.pageY; var a = new Array("梦屿", "博客"); var span = document.createElement("span"); span.style.position = "absolute"; span.style.top = y+"px"; span.style.left = x+"px"; span.style.opacity = 1; span.style.zIndex = 99999999; span.innerHTML = a[a_index]; a_index = (a_index+1)%a.length; span.style.color = "red"; bo.appendChild(span); animation(span,"opacity",0,2000); var top = parseInt(getStyle(span,"top")); animation(span,"top",top-200,2000); function animation(obj,attr,value,time){ var nowTime = new Date(); var nowStyle = parseInt(getStyle(obj,attr)); var timer = setInterval(function(){ var n = (new Date() - nowTime)/time; if(n>=1){ n=1; removeElement(span); clearInterval(timer); } if(attr=="opacity"){ obj.style[attr]=(nowStyle+n*(value-nowStyle)); } obj.style[attr]=(nowStyle+n*(value-nowStyle))+"px"; },1000/60); } function getStyle(obj,attr){ //获得元素的属性 return obj.currentStyle?obj.currentStyle[attr]:getComputedStyle(obj)[attr]; } function removeElement(obj){ //删除节点 var parentElement = obj.parentNode; if(parentElement){ parentElement.removeChild(obj); } } } } </script> [/code]保存之后打开自己的网站,发现是不是随着鼠标点击就会出现你设置的文字了。
2022年07月05日
33 阅读
0 评论
1 点赞
萌ICP备20221019号
暂未备案