zoukankan      html  css  js  c++  java
  • 前端鼠标点击弹出浮动文字--民主、和谐、爱国、自由等

    看到一个前端鼠标点击弹出浮动文字–民主、和谐、爱国、自由等的一个小脚本,放在页面上可以用。

    注:依赖jquery文件

    <script type="text/javascript">
    
        var a_idx = 0;
        jQuery(document).ready(function($) {
            $("body").click(function(e) {
                var a = new Array("富强", "民主", "文明", "和谐", "自由", "平等", "公正" ,"法治", "爱国", "敬业", "诚信", "友善");
                var $i = $("<span />").text(a[a_idx]);
                a_idx = (a_idx + 1) % a.length;
                var x = e.pageX,
                    y = e.pageY;
                $i.css({      //文字样式--------------------------
                    "z-index": 9999999999999 ,
                    "top": y - 20,
                    "left": x,
                    "position": "absolute",
                    "font-weight": "bold",
                    "color": "#ff6651",
                    "-webkit-user-select":"none",
                    "-moz-user-select":"none",
                    "-ms-user-select":"none",
                    "user-select":"none",
                });
                $("body").append($i);
                $i.animate({
                        "top": y - 150,  //点击后文字上升高度
                        "opacity": 0    //透明度
                    },
                    1000,
                    function() {
                        $i.remove();//文字消失时间
                    });
            });
        });
    </script>
  • 相关阅读:
    python
    spice-vdagent
    no ia32-libs
    git conflict
    wget mirror
    docker !veth
    libprotobuff8.so not found
    angular 列表渲染机制
    Java测试技巧
    react组件生命周期
  • 原文地址:https://www.cnblogs.com/mylhy/p/10016874.html
Copyright © 2011-2022 走看看