html+css+js跟随鼠标移动的文字或者特效_css文字跟随鼠标-程序员宅基地

1.html部分

鼠标在这个div区域内，移动鼠标会出现设置的效果

<div id="container" style="height: 100%; width: 100%"></div>

2.js部分

document
        .getElementById("container")
        .addEventListener("mousemove", function (e) {   //监听鼠标移动事件
          // console.log(e);
          var myhint = document.getElementById("hint");
          myhint.style.left = e.offsetX + 8 + "px";  //div位置
          myhint.style.top = e.offsetY + 2 + "px";   //div位置
          myhint.innerHTML = `鼠标双击闭合围栏！<br/> 请绘制单面不重叠围栏！`;  //div内容自定义
          myhint.style.display = "block";
        });

3.css部分

#hint{
  background: url("../assets/image/cursor.png") no-repeat 100%/100%;
  background-size: 100% 100%;
  padding-top: 5px;
  width: 160px;
  height: 64px;
  text-align: left;

本文链接：https://blog.csdn.net/zhaotian2017/article/details/123636450

原作者删帖不实内容删帖广告或垃圾文章投诉

智能推荐

[附源码]Python计算机毕业设计服装销售商城系统_分销系统开源 python-程序员宅基地

文章浏览阅读206次。项目运行环境配置：Pychram社区版+ python3.7.7 + Mysql5.7 + HBuilderX+list pip+Navicat11+Django+nodejs。项目技术：django + python+ Vue 等等组成，B/S模式 +pychram管理等等。环境需要1.运行环境：最好是python3.7.7，我们在这个版本上开发的。其他版本理论上也可以。2.pycharm环境：pycharm都可以。推荐pycharm社区版;_分销系统开源 python

Docker启动时报错：We could not resolve DockerHub using DNS._unable to retrieve dockerhub-程序员宅基地

文章浏览阅读230次。Docker启动时报错：We could not resolve DockerHub using DNS.解决方法：依次检查Firewalld、NetWorkManager、selinux的状态，并关闭关闭Firewalldsystemctl status firewalldsystemctl stop firewalldsystemctl disable firewalld..._unable to retrieve dockerhub

LightOJ1213 Fantasy of a Summation —— 快速幂-程序员宅基地

文章浏览阅读79次。题目链接：https://vjudge.net/problem/LightOJ-12131213 - Fantasy of a SummationPDF (English)StatisticsForumTime Limit:2 second(s)Memory Limit:32 MB...

swiper 前进后退按钮的显示和隐藏_swiper隐藏箭头显示-程序员宅基地

文章浏览阅读4.1k次。swiper 前进后退按钮的显示和隐藏鼠标进入和离开时，前进后退按钮显示和隐藏<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <link rel="stylesheet" href="https://unpk_swiper隐藏箭头显示

Go语言的string（底层结构+常用方法）_go .new.string(-程序员宅基地

文章浏览阅读3k次。字符串Go语言中的字符串是通过UTF-8编码，字符串的值为双引号(")中的内容，可以在Go语言的源码中直接添加非ASCII码字符。字符串底层结构是一个起始地址和长度（字节个数）字符串转义符Go 语言的字符串常见转义符包含回车、换行、单双引号、制表符等转义符含义/r回车符/n换行符/t制表符/’单引号/"双引号//反斜杠例如：//打印一个Windows平台下的一个文件路径package mainimport ( "_go .new.string(

python爬虫基本概述_爬虫脚本是干什么的-程序员宅基地

文章浏览阅读3.6k次。python爬虫基本概述一、爬虫是什么二、爬虫可以做什么三、爬虫的分类四、爬虫的基本流程一、爬虫是什么网络爬虫（Crawler）又称网络蜘蛛，或者网络机器人（Robots）. 它是一种按照一定的规则，自动地抓取万维网信息的程序或者脚本。换句话来说，它可以根据网页的链接地址自动获取网页内容。如果把互联网比做一个大蜘蛛网，它里面有许许多多的网页，网络蜘蛛可以获取所有网页的内容。爬虫是一个模拟人类请求网站行为, 并批量下载网站资源的一种程序或自动..._爬虫脚本是干什么的