关键字:cursor
  • 以鼠标为核心展开的前端需求
    前端以鼠标事件为核心展开的需求,大概就是现在做的线上批改这样的功能。 基本上就是下面几个点。 修改鼠标的形状 通过 cursor 中的 url 把鼠标换成图片的样子。引入图片后,此时点击后获取到的坐标是图片的左上角坐标,所以要让图片以中心点 ...
  • JavaScript 实现九宫格抽奖
    九格宫抽奖相信大家都玩过,今天就用 JavaScript 写个九宫格抽奖玩玩。让中奖不再是梦! 1.预览效果 image 效果图为屏幕录制软件生成,以至于出现滚动不连贯。实际运行中不会出现不连贯的滚动效果 2.完整代码 代码可直接复制运行查 ...
  • web前端入门到实战:CSS实现开关按钮三例
    我们将使用纯CSS打造一些切换开关并使其拥有类似于checkbox的用户体验。 很多时候我们都需要用户通过勾选/取消checkbox来表明他们对一些问题的答案。我们设置了一个标签,一个checkbox,并在提交表单后获取checkbox值, ...
  • web前端入门到实战:CSS3 简单的砸金蛋样式
    实现样式: 1、鼠标移入后,鼠标样式图标变为“锤子”。 2、用户砸金蛋,锤子简单的扬起效果。 3、砸碎金蛋,显示内容。 分析实现步骤: 1、在html中插入一颗金蛋 找一张静态图片或带一点效果的动态图,直接放入img标签即可。 2、鼠标移入 ...
  • 前端特效的似是而非
    让用户看起来是这样,而非实现起来一定是这样。 写特效时经常被逻辑思维所牵绊,A元素B元素分的太清了,反而麻烦。 最近在网上找了一些自己喜欢例子。 1. effect.gif html结构 ...
  • vue 轮播图 原生js编写 ,直接复制代码即插即用
    写了1天 我把它抽象成组件 ,下次要用的使用引用一下就好(代码在下面) 定时轮播鼠标进入时候(用户操作)取消 定时轮播 鼠标按下 的x坐标 和 抬起的x坐标 不一样 就是在拖拽图片不然就是单纯点击图片 进入对应页面 调用方</templat ...
  • web前端入门到实战:html5网页特效-水墨动画
    效果 鼠标触碰按钮,出现水墨风格动画 屏幕自适应 一份html文件,一份css文件,无javascript,上手程度:很简单 笔记 :root 这个 CSS 伪类匹配文档树的根元素。对于 HTML 来说,:root 表示元素,除了优先级更 ...
  • Flex布局(1)
    .user { width: 500px; height: 500px; ...
  • web前端入门到实战:HTML5基础-新增标签+新增属性+布局案例
    html5中常用的结构标签 article 文章 header 头部 nav 导航 section 区域 aside 侧边栏 hgroup 区块的相关信息 figure 定义一组内容及标题 figcaption 定义figure元素的标题 ...
  • web前端入门到实战:css3基础-文本与字体+转换+过渡+动画+案例
    Css3文本与字体 文本阴影 h1 { text-shadow: 5px 5px 5px red; } word-break换行: h1:nth-child(1) { word-break: normal; } /*英文:一行放不下 ...

暂无数据