JavaScript-跟随鼠标移动的文字

xyfyi45

于 2018-02-05 00:20:41 发布

阅读量2.8k

点赞数

文章标签： JavaScrip

本文链接：https://blog.youkuaiyun.com/xyfyi45/article/details/79255786

版权

这篇博客介绍了如何使用JavaScript实现文字跟随鼠标移动的效果。通过HTML和CSS设置元素位置，结合JavaScript监听鼠标事件来动态调整文字的位置。示例中，一个红色的字体颜色为#ff6699、字号为10的文字，在页面上跟随鼠标移动。作者表示这是他们的第一篇博客，还有很多要学习的地方。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

<!doctype html>
<html lang="en">
 <head>
  <meta charset="UTF-8">
  <meta name="Generator" content="EditPlus®">
  <meta name="Author" content="">
  <meta name="Keywords" content="">
  <meta name="Description" content="">
  <title>文字跟随鼠标移动t</title>
  <!-- style是html元素的一个属性，在这里可以直接设置元素的样式 
       这里的.move_out应该是最后这个字体的属性（？不是很清楚） 
	   
	   Position属性有四个可选值，它们分别是：static、absolute、fixed、relative。
	   Pssition:relative是相对定位

  -->
  <style>
  .move_out{position:relative; cursor:hand
  ;font-family:"宋体"
  }
  </style>
  
  
  <script language="javascript">
   var move_out = false;
   var x,y,z;

   function move(){
     if (event.button=

最低0.47元/天解锁文章