js祝福词跟随鼠标代码

最新推荐文章于 2024-08-20 04:38:43 发布
原创 最新推荐文章于 2024-08-20 04:38:43 发布 · 1.3k 阅读 · 0 ·
CC 4.0 BY-SA版权
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
文章标签：

#javascript #function #timer #class #脚本

欢迎词跟踪鼠标
脚本说明:
把如下代码加入<body>区域中
<script language="JavaScript">
<!--
document.write("<style type=/"text/css/"> .spanstyle { position:absolute; visibility:visible; top:-50px; font-size:9pt; color: #FF0033; font-weight:bold; }</style>");
var x,y
var step=20
var flag=0
var message=" 欢迎光临！ "
message=message.split("")
var xpos=new Array()
for (i=0;i<=message.length-1;i++){
xpos[i]=-50}
var ypos=new Array()
for (i=0;i<=message.length-1;i++){
ypos[i]=-50}
function handlerMM(e){
x = (document.layers) ? e.pageX : document.body.scrollLeft+event.clientX
y = (document.layers) ? e.pageY : document.body.scrollTop+event.clientY
flag=1}
function makesnake(){
if (flag==1 && document.all){
for (i=message.length-1; i>=1; i--){
xpos[i]=xpos[i-1]+step
ypos[i]=ypos[i-1]}
xpos[0]=x+step
ypos[0]=y
for (i=0; i<message.length-1; i++){
var thisspan = eval("span"+(i)+".style")
thisspan.posLeft=xpos[i]
thisspan.posTop=ypos[i]}}
else if (flag==1 && document.layers){
for (i=message.length-1; i>=1; i--){
xpos[i]=xpos[i-1]+step
ypos[i]=ypos[i-1]}
xpos[0]=x+step
ypos[0]=y
for (i=0; i<message.length-1; i++){
var thisspan = eval("document.span"+i)
thisspan.left=xpos[i]
thisspan.top=ypos[i]}}
var timer=setTimeout("makesnake()",30)}
for (i=0;i<=message.length-1;i++){
document.write("<span id='span"+i+"'class='spanstyle'>")
document.write(message[i])
document.write("</span>")}
if (document.layers){
document.captureEvents(Event.MOUSEMOVE);}
document.onmousemove = handlerMM;
//-->
</script>

第二步：将写入<body ... > onLoad="makesnake()"
如：
<body onLoad="makesnake()">


字体出现
<SCRIPT LANGUAGE="JavaScript">
<!-- hide script from old browsers
var phrase = "欢迎光临我的个人主页-http://wskdx.anyp.cn";
var lenPhrase = phrase.length;
var phraseOut = "";
var pause = 25;
var i=0;
var j=0;
var animateWidth = 20;
var position=animateWidth;
function stack() {
    if (phrase.charAt(i) != " ") {
      phraseOut = "";
      for (j=0; j<i; j++) {
        phraseOut += phrase.charAt(j);
      }
      for (j=i; j<position; j++) {
        phraseOut += " ";
      }
      phraseOut += phrase.charAt(i);
      for (j=position; j<animateWidth; j++) {
        phraseOut += " ";
      }
      window.status = phraseOut;
      if (position == i) {
        animateWidth++;
        position = animateWidth;
        i++;
      }
      else {
        position--;
      }
    }
    else {
      i++
    }
    if (i<lenPhrase) {
        setTimeout("stack()",pause);
    }
}
// end hiding contents -->
</SCRIPT>

第二步:把如下代码写入<body>区域内
 OnLoad="stack()"
如：
<body bgcolor="#ffffff" OnLoad="stack()">
 
  
 

xianjiangao
关注
情人节程序员用HTML网页表白【canvas实现满屏幕飘小爱心】 HTML5七夕情人节表白网页源码 HTML+CSS+JavaScript
QQ_____365392777的博客
08-06 551
1 网页简介：基于HTML+CSS+JavaScript 制作七夕情人节表白网页、生日祝福、七夕告白、 求婚、浪漫爱情3D相册、炫酷代码,快来制作一款高端的表白网页送(他/她)浪漫的告白,制作修改简单,可自行更换背景音乐,文字和图片即可使用等任意html编辑软件进行运行及修改编辑等操作）。......
一款兼容性好，自动变化的javascript 祝贺词代码（根据不同的节日自动显示不同的祝贺词）
byteway的专栏
03-05 3280
采用了img标签动态绑定和JS动态处理div的方法，根据不同的节日自动显示不同的祝贺词，简易轻便的javascript 代码
祝福语小插件
06-10
如果你想有需要做这种祝福语动画的就来试试吧
JavaScript实现文字跟随鼠标特效
10-23
主要介绍了JavaScript如何实现文字跟随鼠标特效,d代码简单易操作，感兴趣的朋友可以参考下
祝福墙效果（html+Javascript）
10-25
1.采用div+css布局样式，界面非常漂亮 2.JavaScript技术 3.HTML
生日祝福js,html源码
05-24
生日祝福网页，送给我想念的那个女生，使用原生js编写。背景为一个粒子系统，页面包含打字机效果，连续点击鼠标即可弹奏《生日快乐》的钢琴曲。附加了生日倒计时，祝福用文本打字机效果逐字展现。其他功能可以自由发挥，愿有情人终成眷属。
JS_祝愿墙
魂断楼兰的博客
11-30 1054
祝愿墙<!DOCTYPE html> <html> <head lang="en"> <meta charset="UTF-8"> <title></title> <style> body { margin: 0 auto; padding: 0px; font-size: 12px;
背景样式、彩虹屁、鼠标样式、炫酷的登入、生日祝福
05-04
此外，还可以结合鼠标移动事件监听器（如`onmousemove`），实现跟随鼠标移动的动态效果。 接下来，炫酷的登录界面常常包含动态输入验证、图形验证码、键盘动画等元素。JavaScript可以处理用户的输入，实时验证...
百度首页龙跟随特效实现指南 V1.0
- “long.js”指的应该是JavaScript文件，负责提供龙跟随效果的动态行为和逻辑控制。 - “使用说明.txt”是一个纯文本文件，里面会包含如何使用这个特效的说明，帮助用户理解如何安装、配置和应用“long.html”和...
爱心代码+图片+音乐+头像+主题
04-02
它可能包含一系列的HTML标签，用来构建页面的基础结构，利用CSS样式来美化页面元素，并通过JavaScript来增加页面的动态效果，比如让爱心图案闪烁、旋转或是跟随用户的鼠标移动。这样的效果无疑会给浏览者带来惊喜和...
HTML5七夕情人节表白代码.zip
11-02
此外，为了增加神秘感和惊喜，还可以利用JavaScript实现一些隐藏功能，比如点击特定元素触发隐藏的祝福语或视频播放。 总之，HTML5七夕情人节表白代码是将技术与情感相结合的创意表现，通过熟练运用现代Web技术，...
利用css js写一个简单520祝福。
bs3412的博客
05-19 408
由于用到bootstrap，sweetalert，需要引入它们的css文件与js文件。 因为我用的是本地的，有需要可以使用我的。 <link href="http://520.bs666.cn:1314/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-wEmeIV1mKuiNpC+IOBjI7aAzPcEZeedi5yW5f2yOq55WWLwNGmvvx4Um1vskeMj0" crossorigin="anonymous"
javascript技术男用代码祝福生日快乐
最新发布
weixin_41003505的博客
08-20 264
我整理的一些关于【Java】的项目学习资料（附讲解～～）和大家一起分享、学习一下：https://d.51cto.com/bLN8S1JavaScript 生日祝福代码实现 在这篇文章中，我们将学习如何用 JavaScript 编写一个简单的程序，帮助你在生日时发送祝福消息。本文将分步介绍，我们首先列出整个流程，然后详细...
js的三种弹窗：alert、confirm、prompt
qq_40690077的博客
08-06 746
1、alert()   alert 方法有一个参数，就是用户想弹出的内容，弹出框很简单，就一个显示功能。你可以点击确认关闭这个弹出框。   例如：alert(“hello woorld！”);    2、confirm()   这个方法要求用户选择。有确认有返回。confirm 方法的返回值为 true 或 false。   例如：var flag = confirm(“你快乐么？”);   点击确定，flag的值为true；点击取消则为false；    3、prompt()   这个弹出框相对于上面两个
js生日祝福
耿直boy
11-30 5462
小武祝你生日快乐 乐仔  生日快乐     function TList() {     max=TList.arguments.length;     for (i=0; i         this[i]=TList.arguments[i];     }     tl = new TList(  "    推荐两首歌,在阅读之前，一首纯音乐——《冬雪
JS祝福墙小案例
摇摆小仙的博客
05-18 1161
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equ...
HTML5七夕情人节表白结婚邀请函网页制作(HTML+CSS+JavaScript)
HTML网页设计 专注大学生网页设计
09-25 7780
📒网站文件方面：html网页结构文件、css网页样式文件、js网页特效文件、images网页图片文件；📙网页编辑方面等任意html编辑软件进行运行及修改编辑等操作）。其中：（1）📜html文件包含：其中index.html是首页、其他html为二级页面；（2）📑 css文件包含：css全部页面样式,3D动态效果,雪花飘落等等（3）📄 js文件包含：页面炫酷效果实现。
十分钟实现节日祝福动画，CSS+JavaScript实现元旦祝福动画，祝大家元旦快乐
热门推荐
AlbertYang的博客
12-31 1万+
视频已同步到我的B站账号欢迎大家关注。https://space.bilibili.com/563010186参考代码HTML:<!DOCTYPE html> <htm...
跟随鼠标走的文字的html代码,最经典的文字跟随鼠标的JS网页特效
weixin_33657499的博客
06-04 611
跟随鼠标的文字.spanstyle {position:absolute;visibility:visible;top:-50px;font-size: 9 pt;color: #000000 ;}var x,yvar step=20var flag=0var message=" 欢迎光临小站，有你需要的素材"message=message.split("")var xpos=new Array(...
JavaScript动态时钟：跟随鼠标移动的双层时钟代码
"一个JavaScript实现的跟随鼠标移动的双层时钟代码，包含日期和时间显示，具有自定义颜色和尺寸的功能。" 这篇资源提供的代码是一个基于JavaScript的动态时钟，它可以在网页上跟随用户的鼠标指针飘动，同时显示日期...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值