JS或jquery 实现 点赞 +1 动画效果代码

Web前端 码拜 8年前 (2015-11-17) 6505次浏览 0个评论

JS或jquery 实现 比如点赞后出现的 +1 动画效果!代码如下:

JS或jquery 实现 点赞 +1 动画效果代码

<html><head><script src=”http://libs.useso.com/js/jquery/1.11.1/jquery.min.js”></script>
<script type=”text/javascript”>

$(document).ready(function(e) {
$(‘a.zhan’).click(function(){
var left = parseInt($(this).offset().left)+10, top = parseInt($(this).offset().top)-10, obj=$(this);
$(this).append(‘<div id=”zhan”><b>+1<\/b></\div>’);
$(‘#zhan’).css({‘position’:’absolute’,’z-index’:’1′, ‘color’:’#C30′,’left’:left+’px’,’top’:top+’px’}).animate({top:top-10,left:left+10},’slow’,function(){
$(this).fadeIn(‘fast’).remove();
var Num = parseInt(obj.find(‘span’).text());
Num++;
obj.find(‘span’).text(Num);
});

return false;
});
});

</script></head><body>
<br /><br /><br /><br /><br /><br />
<a class=”zhan” href=”#”>赞(<span>0</span>)</a>
</body></html>


CodeBye 版权所有丨如未注明 , 均为原创丨本网站采用BY-NC-SA协议进行授权 , 转载请注明JS或jquery 实现 点赞 +1 动画效果代码
喜欢 (22)
[1034331897@qq.com]
分享 (0)

文章评论已关闭!