点赞+1 效果

最新推荐文章于 2024-07-07 15:51:10 发布

Rkatsiteli

最新推荐文章于 2024-07-07 15:51:10 发布

阅读量7.4k

点赞数 1

分类专栏： JavaScript + JQuery

本文链接：https://blog.csdn.net/qq_16559905/article/details/52163865

版权

JavaScript + JQuery 专栏收录该内容

42 篇文章 0 订阅

订阅专栏

见图案

这里写图片描述

代码附上：

<!DOCTYPE html>
<html>

    <head>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0,user-scalable=no">
        <title></title>
    </head>

    <body>
        <div class="divclass" style="margin-top: 50%;">
            页面元素
        </div>
    </body>
    <script src="../js/zepto.min.js"></script>
    <script>
        $("html,body").on("click",".divclass",function(e){
            anp(e);
        })
        function anp(e) {
            var $i = $("<b>").text("+" + 1);
            var x = e.pageX,
                y = e.pageY;
            $i.css({
                top: y - 20,
                left: x,
                position: "absolute",
                color: "#E94F06"
            });
            $("body").append($i);
            $i.animate({
                top: y - 120,
                opacity: 0,
                "font-size": "1.4em"
            }, 1500, function() {
                $i.remove();
            });
            e.stopPropagation();
        }
    </script>

</html>

Rkatsiteli

关注

1
点赞
踩
3

收藏

觉得还不错? 一键收藏
打赏
0
评论
点赞+1 效果

见图案代码附上：<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0,user-scalable=no"> <title></title> </hea
复制链接

扫一扫