为你的 Blog 添加“跟随鼠标的文字”功能。

原创 2004年07月09日 16:11:00

在“选项”->“配置”的“静态新闻/声明”中加入下面的语句就可以了:

<style type="text/css">
.spanstyle
{
 position:absolute;
 visibility:visible;
 top:-500px;
 font-size:10pt;
 color: #0000ff;
 font-weight:bold;
}
</style>

<script>
 var x,y
 var step=15
 var flag=0
 var message="欢迎您亲自光临铁拳的小站"
 message=message.split("")
 var xpos=new Array()
 for (i=0;i<=message.length;i++)
 {
  xpos[i]=-500
 }
 var ypos=new Array()
 for (i=0;i<=message.length;i++)
 {
  ypos[i]=-500
 }
 function handlerMM(e)
 {
  x = (document.layers) ? e.pageX : document.body.scrollLeft+event.clientX-5
  y = (document.layers) ? e.pageY : document.body.scrollTop+event.clientY-75
  flag=1
 }
 function makesnake()
 {
  if (flag==1 && document.all)
  {
   for (i=message.length; 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; 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; 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; i++)
   {
    var thisspan = eval("document.span"+i)
    thisspan.left=xpos[i]
    thisspan.top=ypos[i]
   }
  }
  var timer=setTimeout("makesnake()",30)
 }
</script>

<body onLoad="makesnake()" >
<script>
 for (i=0;i<=message.length;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>

 

JavaScript:一个鼠标动态跟随文字特效的示例

这是去年我学习JavaScript时写的一个代码,里面有比较详细的注释。我个人以为是一个学习javascript和鼠标事件的好例子。// **************************   源代...
  • Soft21
  • Soft21
  • 2001年08月29日 18:35
  • 1495

sublime text 输入法不跟随光标

1、引子 sublime text 有个BUG,那就是不支持中文的鼠标跟随(和PS类似输入的光标和文字候选框不在一起)。如下图: 2、插件 安装IMESupport插件即可插件,这款...
  • quzhongxin
  • quzhongxin
  • 2015年05月15日 09:19
  • 14778

HighCharts中添加一条会随着鼠标移动的竖线(crosshairs)

HighCharts中添加一条会随着鼠标移动的竖线crosshairs
  • bsh_csn
  • bsh_csn
  • 2016年09月22日 10:03
  • 3929

MFC/VC中当鼠标停靠在按钮等控件上时出现文字提示功能

在VC中,常常为一些图片按钮添加一些功能提示。 下面讲解实现过程,大部分代码是网上的,但已经过测试,可以直接使用~ 该功能的实现主要是用CToolTipCtrl类。该类在VC  msdn中...
  • dongganxiao_maidou
  • dongganxiao_maidou
  • 2016年10月11日 09:03
  • 1620

VC中当鼠标停靠在按钮等控件上时出现文字提示功能

首先在对话框的头文件中加入初始化语句:public:下,加入:CToolTipCtrl    m_stat; 然后在初始化对话框函数中加入:(注:我开始在OnCreate函数中加的这段代码,发现...
  • yuyuyuzhangxiong
  • yuyuyuzhangxiong
  • 2017年02月08日 17:39
  • 369

MFC/VC中当鼠标停靠在按钮等控件上时出现文字提示功能

 在VC中,常常为一些图片按钮添加一些功能提示。 下面讲解实现过程: 该功能的实现主要是用CToolTipCtrl类。该类在VC  msdn中有详细说明。 首先在对话框的头文件中加入初始化...
  • lsyyoyo
  • lsyyoyo
  • 2014年08月21日 09:43
  • 1157

jQuery实现小功能之鼠标悬浮时上下翻滚文字

【滚动.html】 滚动
  • viciousDear
  • viciousDear
  • 2015年04月15日 19:35
  • 1061

文字或图片跟随鼠标移动或键盘控制图片移动实例(javascript实现)

.html代码如下: 鼠标移动文字跟着移动 *{margin:0} #layer{ width:100px; height:30px; position:relative; ...
  • yayun0516
  • yayun0516
  • 2014年12月01日 10:22
  • 2064

鼠标跟随代码,转动的文字_浏览器特效

font-style: italic; font-weight: bold; font-family: 'comic sans ms', verdana, arial; color: #000; p...
  • langal1212
  • langal1212
  • 2015年09月07日 09:31
  • 273

鼠标文字跟随

文字跟随鼠标 body{  background-color:#FFFFFF; } .spanstyle{  color:#2244FF;  font-family:"Courie...
  • zhu_nana
  • zhu_nana
  • 2012年09月24日 17:49
  • 348
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:为你的 Blog 添加“跟随鼠标的文字”功能。
举报原因:
原因补充:

(最多只允许输入30个字)