点赞+1 动画、鼠标点击动画

原理很简单通过绝对定位和样式动画就可以实现了。

不多说了，看下面demo

<html>
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1" />
<script  src="http://libs.baidu.com/jquery/1.7.2/jquery.min.js"></script>
<style>h1,h2{width:200px;height:30px;text-align:center;margin:200px auto;}
</style>
</head>
<body><h1>点击屏幕看看</h1><h2><a href="http://share.lrshuai.top/demo2.html">滚动条:</a></h2>
<script>
$(document).ready(function(){  //鼠标点击动画$('body').click(function(e) {e = e || window.event;xponit = e.pageX || e.clientX + document.body.scroolLeft;yponit = e.pageY || e.clientY + document.body.scrollTop;console.log("xponit",xponit);console.log("yponit",yponit);var elment = "<div class='pointanim' style='position:absolute;top:"+yponit+"px;left:"+xponit+"px;color:red;text-align:center;font-size:2em;'>+1</div>";$(this).append(elment);$(".pointanim").animate({opacity:'0.5',top:'0'},1000,remove)});//回调函数function remove(){$(".pointanim").remove();}})
</script>
</html>

正文到此结束，觉得有帮助，点个赞可好！！！
博客：http://www.lrshuai.top/atc/show/58

点赞动画,鼠标点击动画相关推荐

prototype鼠标指针_html5鼠标点击页面光标圆点动画特效
特效描述:html5 鼠标点击页面光标圆点动画特效.html5圆点动画,光标动画,鼠标点击页面事件. 代码结构 1. 引入JS 2. HTML代码点击任何地方看效果 'use strict'; v ...
前端鼠标点击出现动画大全
一:前端鼠标点击出现自定义汉字 <!DOCTYPE html> <html lang="en"> <head><meta charset= ...
PPT设置动画：点击一次鼠标，显示一部分内容
1. 选中控件(想添加动画的那部分) 2. 添加动画效果 3. 设置动画"点击鼠标"时出现参考: https://zhidao.baidu.com/question/564529 ...
vue 鼠标点击特效动画（css3动画），水波纹动画效果
效果展示思路要点通过向数组 waves push操作插入水波纹相关数据,使用 vue v-for 动态更新 waves 生成水波纹数据水波纹使用fixed定位通过点击事件的 clientX 和 ...
鼠标点击地面，主角移动并切换动画状态
1.给地形添加一个标签 2.烘焙地形 3.给主角绑定导航代理组件 public class PlayerMouseMove02 : MonoBehaviour {public GameObject a ...
html动态跟随鼠标效果,使用JS实现气泡跟随鼠标移动的动画效果
气泡跟随鼠标移动,并在每次点击时产生不同的变化效果如下简单的气泡效果 body{background-color:#000000;margin:0px;overflow:hidden} var c ...
3 css 奖品出现弹出动画_基于jquery css3实现点击动画弹出表单源码特效
下图给大家展示了使用jquery css实现的点击动画弹出表单源码,有上传表单.删除表单.发送评论表单,都是通过鼠标点击图标按钮动画弹出的表单源码特效. 效果图展示如下: html代码: 上传选择文 ...
html5随鼠标移动动画,使用JS实现气泡跟随鼠标移动的动画效果
气泡跟随鼠标移动,并在每次点击时产生不同的变化效果如下简单的气泡效果 body{background-color:#000000;margin:0px;overflow:hidden} var c ...
android 图片查看动画,Android 共享动画实现点击列表图片跳转查看大图页面
主要内容使用系统提供的 API 实现共享动画在实现过程中遇到的问题图片点击和关闭之后会出现短暂的黑屏问题实现的动画效果如下: 共享动画.gif 具体实现这个效果是在两个页面之间的切换动画,既然是两个 ...

点赞动画,鼠标点击动画

点赞+1 动画、鼠标点击动画

原理很简单通过绝对定位和样式动画就可以实现了。

不多说了，看下面demo

点赞动画,鼠标点击动画相关推荐

最新文章

热门文章

点赞动画,鼠标点击动画

点赞+1 动画、鼠标点击动画

原理很简单通过绝对定位 和 样式动画就可以实现了。

不多说了，看下面demo

点赞动画,鼠标点击动画相关推荐

最新文章

热门文章

原理很简单通过绝对定位和样式动画就可以实现了。