zoukankan      html  css  js  c++  java
  • js自定义鼠标的图片

    1.首先下载一张svg格式的图片用编译器打开copy代码
    2.svg转换函数 methods
    getSvg(html, offsetX, offsetY) {
    return `url(data:image/svg+xml;base64,${btoa(unescape(encodeURIComponent(html)))}
    ) ${offsetX} ${offsetY},default`;
    },

    3.在data里面定义一个常量
    mouseImg: this.getSvg(`<svg xmlns="http://www.w3.org/2000/svg" width="25" height="25" viewBox="0 0 24.972 24">
    <defs>
    <style>
    .cls-1 {
    fill: #42aac5;
    }
    </style>
    </defs>
    <path id="路径_4548" data-name="路径 4548" class="cls-1" d="M14.665,22.973a.99.99,0,0,1-.511.889,1.078,1.078,0,0,1-1.057,0,.99.99,0,0,1-.511-.889V8.989a.974.974,0,0,1,.208-.6L17.788,2H3.222L8.216,8.39a.974.974,0,0,1,.208.6v8.575L10.2,19.27a.971.971,0,0,1,0,1.412,1.071,1.071,0,0,1-1.471,0l-2.081-2a.979.979,0,0,1-.3-.706V9.323L.308,1.6A1,1,0,0,1,1.141,0H19.868A1,1,0,0,1,20.7,1.6L14.665,9.323v13.65Zm3.122-10.987H24.03a1,1,0,1,1,0,2H17.787a1,1,0,1,1,0-2Zm0,4H24.03a1,1,0,1,1,0,2H17.787a1,1,0,1,1,0-2Zm0,4H24.03a1,1,0,1,1,0,2H17.787a1,1,0,1,1,0-2Z" transform="translate(-0.098)"/>
    </svg>`, 25, 25),
    4.在mounted()里面 修改 鼠标经过的标签的样式 this.$refs.bullet.style.cursor = this.mouseImg;

  • 相关阅读:
    Mysql的表名/字段名/字段值是否区分大小写
    20个PHP程序性能优化的方法
    PHP中大括号用法
    PHP伪类型和伪变量
    PHP中关于取模运算及符号
    PHP之array_flip()方法
    PHP之implode()方法
    PHP中is_null()方法
    原型模式(Prototype)
    适配器模式
  • 原文地址:https://www.cnblogs.com/daifuchao/p/14611320.html
Copyright © 2011-2022 走看看