首页 > 其他分享 >jquery006-点赞

jquery006-点赞

时间:2022-11-27 09:44:46浏览次数:46  
标签:obj bottom opa 点赞 var div jquery006 size

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<style>
.click{
color: darkred;
position: absolute;
}
</style>
</head>
<body style="width: 980px;margin: 0 auto">
<div style="width: 980px;height: 200px;background-color: #9a9a9a">
<div id="i1" style="position: relative;font-size: 20px;padding-top: 150px;width: 30px;height: 30px">

</div>

</div>
<script src="jquery3.6.1.js"></script>
<script>
$('#i1').click(function (){
var div = document.createElement('div');
$(div).text('+1');
$(div).addClass('click');
$(this).append(div);
var opa = 1;
var left = 30;
var bottom = 0;
var size = 20;
var obj = setInterval(function (){
opa = opa - 0.1;
left = left + 20;
bottom = bottom + 20;
size = size + 10;
$(div).css('opacity',opa);
$(div).css('left',left+'px');
$(div).css('bottom',bottom+'px');
$(div).css('font-size',size+'px');
if(opa < 0){
clearInterval(obj);
$(div).remove();
console.log('关闭了');
};
},100);
// console.log(opa);//尽管opa在obj中有运算,在obj外层opa还是1,只能在obj内部设置条件
});
</script>
</body>
</html>

标签:obj,bottom,opa,点赞,var,div,jquery006,size
From: https://www.cnblogs.com/lfyxys/p/16929031.html

相关文章

  • django实现点赞功能
    1,在文章模型中添加点赞字段,用多对多关系统计所有为文章点赞的用户。classArticle(BaseModel):...#为文章点赞users_like=models.ManyToManyField(......
  • 基于Redis实现点赞、点赞用户按时间排序、好友关注和共同关注等业务
    点赞功能业务说明1、每个用户只能点一次赞,再次点击时取消点赞2、在Blog属性中增加isLike字段,用于判断当前用户是否点赞3、isLike的值从Redis中获取,可以用redis自带的......
  • 点赞,取消点赞组件
    <template><divclass="collect-container"><van-loadingv-if="isLoading"type="spinner"color="#1989fa"></van-loading><van-iconv-else......
  • 自动点赞
    varx=5,y=10;functionautoClick(){y=y+5;varzan=document.getElementsByClassName('itemqz_like_btn_v3');for(vari=0;i<zan.length;i++){if(zan[i].attributes......
  • 文章的点赞点踩制作
    文章的添加博客园打开需要拷贝的文章,右键检查--》选择cnblogs_post_body这一个div,然后复制outerHTML到admin后台文章表里面最后需要在文章详情页的文章内容那一行添加一......
  • 0-2 测试面试题- 测试方法_压力测试怎么测_设计朋友圈点赞_HTTP报文段_HTTP请求报文_T
    面试题及解析答案来自牛客网https://www.nowcoder.com/exam/interview/5了解什么测试方法?测试的方法?写测试用例的方法?分析测试点的方法?测试是个大工程,很多环节,具......
  • 点赞(十九)
    点赞支持对帖子、评论点赞。第1次点赞,第2次取消点赞。首页点赞数量统计帖子的点赞数量。详情页点赞数量统计点赞数量。显示点赞状态。一、新建生成redi......
  • 巧用 transition 实现短视频 APP 点赞动画
    在各种短视频界面上,我们经常会看到类似这样的点赞动画:非常的有意思,有意思的交互会让用户更愿意进行互动。那么,这么有趣的点赞动画,有没有可能使用纯CSS实现呢?那当然是......
  • 10 继承模板 & inclution_tag & 文章的详情页设计 & 文章点赞 & 文章的评论
    模板继承即渲染:文章点赞或反对:跟评论和子评论:settings.pysettings.pyUSE_TZ=False#转时区改为False编写url:urls.pyfromdjango.urlsimportre_pat......