JQuery(四)---【使用JQuery实现动画效果】

目录

前言

一.隐藏和显示

1.1使用方法

1.2案例演示(1)

1.3隐藏/显示效果一键切换

二.淡入淡出效果

2.1使用方法

 2.2案例演示(fadeIn)

2.3案例演示(fadeOut)

2.4案例演示(fadeToggle)

2.5案例演示(fadeTo)

三.滑动

3.1使用方法

 3.2案例演示(slideDown)

3.3案例演示(slideUp)

3.4案例演示(slideToggle)

四.动画【重要】

4.1使用方法

4.2案例演示

4.3使用队列功能实现多个动画

五.停止动画

5.1使用方法

5.2案例演示

六.callback函数

6.1使用方法

6.2为什么要使用callback函数

七.chaining绑定

7.1chaining介绍

7.2chaining使用方法

 7.3案例演示

前言

JQuery(一)---【JQuery简介、安装、初步使用、各种事件】-CSDN博客

JQuery(二)---【使用JQuery对HTML、CSS进行操作】-CSDN博客

JQuery(三)---【使用JQuery动态设置浏览器窗口尺寸、JQuery的遍历】-CSDN博客

一.隐藏和显示

1.1使用方法

通过JQuery可以使用:“hide()”和“show()”方法来隐藏显示HTML元素:

使用格式:

  • “hide”:$(selector).hide(speed,callback)
  • “show”:$(selector).show(speed,callback)

两个参数

  1. speed:规定隐藏/显示的速度,可以取以下值:“slow”、“fast”、“100”(毫秒数值)
  2. callback:隐藏或显示完成后所执行的函数

1.2案例演示(1)

下面是一个:“点击按钮来控制div标签显示/隐藏的案例

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title><script src="https://code.jquery.com/jquery-3.7.1.min.js"></script>
</head>
<body><p id="p1">如果点击“隐藏”按钮,我就会消失</p><button id="hide">隐藏</button><button id="show">显示</button><script>$(document).ready(function(){$("#hide").click(function(){$("#p1").hide();});$("#show").click(function(){$("#p1").show();});});</script>
</body>
</html>

点击前:

点击后:

1.3隐藏/显示效果一键切换

除了手动使用:“hide()”和“show()”方法来设置某个元素的状态,我们还可以使用:“toggle()”方法来自动进行状态的切换,切换规则如下:

  1. “如果当前是显示状态,那么就会切换到隐藏状态”
  2. “如果当前是隐藏状态,那么就会切换到显示状态

 使用格式:

  • $(selector).toggle(speed,callback)

 这里的“speed”和“callback”参数使用同上,就不再赘述了

二.淡入淡出效果

2.1使用方法

通过JQuery可以实现元素的淡入淡出,即渐变式消失/隐藏

我们通过以下四种方法实现:

  1. fadeIn(speed,callback)”:淡入已隐藏元素(将隐藏元素渐变的显示出来)
  2. fadeOut(speed,callback)”:淡出可见元素(将可见元素渐变的隐藏)
  3. fadeToggle(speed,callback)”:淡入隐藏/可见元素(将隐藏/可见元素渐变的显示/隐藏)
  4. fadeTo(speed,opacity,callback)”:淡出可见元素(将可见元素渐变的隐藏)同时允许指定淡出的不透明度(值介于0-1之间)

 2.2案例演示(fadeIn)

下面是一个:“点击按钮之后,将三个隐藏的不同颜色的矩形渐变的显示出来

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title><script src="https://code.jquery.com/jquery-3.7.1.min.js"></script>
</head>
<body><p>演示带有不同参数的fadeIn方法</p><button id="bt1">点击之后,将三个矩形淡入</button><br><br><div id="div1" style="width: 80px;height: 80px;background-color: red;margin: 10px;display: none;"></div><div id="div2" style="width: 80px;height: 80px;background-color: green;margin: 10px;display: none;"></div><div id="div3" style="width: 80px;height: 80px;background-color: blue; margin: 10px;display: none;"></div><script>$(document).ready(function(){$("#bt1").click(function(){$("#div1").fadeIn();$("#div2").fadeIn("slow");$("#div3").fadeIn(3000);});});</script>
</body>
</html>

点击前:

点击后:

动图不方便制作,建议小伙伴们自己敲一下代码,看一下这个动画效果

2.3案例演示(fadeOut)

下面是一个:“点击按钮之后,将三个不同颜色的矩形渐变的隐藏

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title><script src="https://code.jquery.com/jquery-3.7.1.min.js"></script>
</head>
<body><p>演示带有不同参数的fadeIn方法</p><button id="bt1">点击之后,将三个矩形淡入</button><br><br><div id="div1" style="width: 80px;height: 80px;background-color: red;margin: 10px;"></div><div id="div2" style="width: 80px;height: 80px;background-color: green;margin: 10px;"></div><div id="div3" style="width: 80px;height: 80px;background-color: blue; margin: 10px;"></div><script>$(document).ready(function(){$("#bt1").click(function(){$("#div1").fadeOut();$("#div2").fadeOut("slow");$("#div3").fadeOut(3000);});});</script>
</body>
</html>

点击前:

点击后:

2.4案例演示(fadeToggle)

下面是一个:“点击按钮之后,将三个不同颜色的矩形渐变的隐藏/显示

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title><script src="https://code.jquery.com/jquery-3.7.1.min.js"></script>
</head>
<body><p>演示带有不同参数的fadeIn方法</p><button id="bt1">点击之后,将三个矩形切换状态</button><br><br><div id="div1" style="width: 80px;height: 80px;background-color: red;margin: 10px;"></div><div id="div2" style="width: 80px;height: 80px;background-color: green;margin: 10px;"></div><div id="div3" style="width: 80px;height: 80px;background-color: blue; margin: 10px;"></div><script>$(document).ready(function(){$("#bt1").click(function(){$("#div1").fadeToggle();$("#div2").fadeToggle("slow");$("#div3").fadeToggle(3000);});});</script>
</body>
</html>

效果:

建议小伙伴自己敲代码看一下过程,这个动画还是很不错的!

2.5案例演示(fadeTo)

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title><script src="https://code.jquery.com/jquery-3.7.1.min.js"></script>
</head>
<body><p>演示带有不同参数的fadeIn方法</p><button id="bt1">点击之后,将三个矩形切换状态</button><br><br><div id="div1" style="width: 80px;height: 80px;background-color: red;margin: 10px;"></div><div id="div2" style="width: 80px;height: 80px;background-color: green;margin: 10px;"></div><div id="div3" style="width: 80px;height: 80px;background-color: blue; margin: 10px;"></div><script>$(document).ready(function(){$("#bt1").click(function(){$("#div1").fadeTo("slow",0.15);$("#div2").fadeTo("slow",0.4);$("#div3").fadeTo("slow",0.7);});});</script>
</body>
</html>

效果:

三.滑动

3.1使用方法

使用JQuery可以使元素实现滑动效果

JQuery提供了三种方法供我们滑动:

  • slideDown(speed,callback)”:向下滑动元素
  • slideUp(speed,callback)”:向上滑动元素
  • slidToggle(speed,callback)”:在向上/向下滑动之间自动切换

 3.2案例演示(slideDown)

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title><script src="https://code.jquery.com/jquery-3.7.1.min.js"></script><style>.flip{width: 200px;background-color: #e5eecc;border: solid 1px #c3c3c3;text-align: center;padding: 5px;margin: 0px;}div.flip{height: 120px;display: none;}</style>
</head>
<body><p class="flip">请点击这里</p><div class="flip"><p>这是一个例子</p><p>这是另一个例子</p></div><script>$(document).ready(function(){$("p.flip").click(function(){$("div.flip").slideDown("slow");});});</script>
</body>
</html>

点击前:

点击后:

3.3案例演示(slideUp)

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title><script src="https://code.jquery.com/jquery-3.7.1.min.js"></script><style>.flip{width: 200px;background-color: #e5eecc;border: solid 1px #c3c3c3;text-align: center;padding: 5px;margin: 0px;}div.flip{height: 120px;}</style>
</head>
<body><div class="flip"><p>这是一个例子</p><p>这是另一个例子</p></div><p class="flip">请点击这里</p><script>$(document).ready(function(){$("p.flip").click(function(){$("div.flip").slideUp("slow");});});</script>
</body>
</html>

点击前:

点击后:

3.4案例演示(slideToggle)

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title><script src="https://code.jquery.com/jquery-3.7.1.min.js"></script><style>.flip{width: 200px;background-color: #e5eecc;border: solid 1px #c3c3c3;text-align: center;padding: 5px;margin: 0px;}div.flip{height: 120px;}</style>
</head>
<body><div class="flip"><p>这是一个例子</p><p>这是另一个例子</p></div><p class="flip">请点击这里</p><script>$(document).ready(function(){$("p.flip").click(function(){$("div.flip").slideToggle("slow");});});</script>
</body>
</html>

效果:


使用“slideToggle”之后我们可以很方便的实现对元素滑动的控制

而使用“slideUp”和“slideDown”实现滑动,只能是单侧方向,并不能“收回

四.动画【重要】

4.1使用方法

JQuery支持我们创建自定义的动画,从而实现“花里胡哨”的功能

使用“animate()”方法可以创建一个自定义动画

使用方法

  • $(selector).animate({params},speed,callback)

参数说明

  • params参数定义形成动画的CSS属性
  • speed规定动画的时长,可以取:“slow”、“fast”、“100(数值单位)”(毫秒)
  • callback表示动画完成后执行的函数

通过使用animate我们可以修改一个元素的“几乎所有的CSS”属性,从而实现更加复杂的动画效果

PS:“如果我们需要对某个元素实现移动动画,需要将这个元素的position属性设置为absolute、relative、fixed其中一种

4.2案例演示

下面是一个:“点击按钮后,div矩形向右移动,并且透明度为50%,高度/宽度变为150

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title><script src="https://code.jquery.com/jquery-3.7.1.min.js"></script>
</head>
<body><button>开始动画</button><p>默认情况下,所有 HTML 元素的位置都是静态的,并且无法移动。如需对位置进行操作,记得首先把元素的 CSS position 属性设置为 relative、fixed 或 absolute。</p><div style="background-color: aqua;height: 100px;width: 100px;position: absolute;"></div><script>$(document).ready(function(){$("button").click(function(){$("div").animate({left : '250px',opacity : '0.5',height : '150px',width : '150px'});});});</script>
</body>
</html>

点击前:

点击后:

(ps:“除了使用固定值来控制移动的距离,我们也可以使用相对值来控制元素的移动,使用方法是在值的前面加上’+=‘或’-=‘来表示加或减”)

4.3使用队列功能实现多个动画

如果我们想要一次执行多个连续的动画,我们就需要使用:“队列”的功能

使用方法也很简单,就是一次性写入多个animate()方法即可

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title><script src="https://code.jquery.com/jquery-3.7.1.min.js"></script>
</head>
<body><button>开始动画</button><p>默认情况下,所有 HTML 元素的位置都是静态的,并且无法移动。如需对位置进行操作,记得首先把元素的 CSS position 属性设置为 relative、fixed 或 absolute。</p><div style="background-color: aqua;height: 100px;width: 100px;position: absolute;"></div><script>$(document).ready(function(){$("button").click(function(){$("div").animate({height : '300px',opacity : '0.4'},"slow");$("div").animate({width : '300px',opacity : '0.8'},"slow");$("div").animate({height : '100px',opacity : '0.4'},"slow");$("div").animate({height : '100px',opacity : '0.8'},"slow");});});</script>
</body>
</html>

效果:

图片会不断进行依次进行四个方向的拉伸

五.停止动画

5.1使用方法

JQuery提供“stop()”方法在动画结束之前强制停止动画

使用方法

  • $(selector).stop(stopAll,goToEnd);

参数说明

  1. stopAll规定是否应该清除动画队列,默认是false,只停止这个动画,该动画所属队列中的其他动画不停止
  2. goToEnd规定是否立即完成当前动画(相当于强制完成动画省略过程也算停止了),默认是false

5.2案例演示

下面是一个:“点击按钮后,div标签内容出现并且以很慢的速度向下滑动,直到点击停止滑动或者点击按钮停止

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title><script src="https://code.jquery.com/jquery-3.7.1.min.js"></script>
</head>
<body><button>停止滑动</button><p id="sample">点我向下滑动面板</p><div style="background-color: aqua;height: 200px;width: 200px;display: none;"><p>这是一个例子</p></div><script>$(document).ready(function(){$("#sample").click(function(){$("div").slideDown(5000);});$("button").click(function(){$("div").stop();});});</script>
</body>
</html>

效果:

六.callback函数

6.1使用方法

callback函数用来在动画100%完成后执行

callback函数将一个函数名作为一个参数传递给它

6.2为什么要使用callback函数

我们假设一个场景:“假设我们点击一个按钮之后,<p>段落会逐渐消失,并且在消失完成后会弹出一个弹窗提示<p>段落已经消失

我们先看看不使用callback的状态:

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title><script src="https://code.jquery.com/jquery-3.7.1.min.js"></script>
</head>
<body><button>点我隐藏段落</button><p id="sample">这是一个示例段落</p><script>$(document).ready(function(){$("button").click(function(){$("#sample").hide();alert("段落被成功隐藏了");});});</script>
</body>
</html>

点击后:

可以看到,段落还没被隐藏,弹窗就已经出现了,此时我们点击“确定”后,段落才会被隐藏,这显而是不正确的。

错误原因:如果大家接触过软件开发,会明白软件开发中经常要用到多线程,在这里“隐藏功能”被视作一个“子线程”,而“弹窗”被视作一个“主线程”,此时“主线程”堵塞了“子线程”

如果我们使用callback函数,可以很好的解决这个问题:

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title><script src="https://code.jquery.com/jquery-3.7.1.min.js"></script>
</head>
<body><button>点我隐藏段落</button><p id="sample">这是一个示例段落</p><script>$(document).ready(function(){$("button").click(function(){$("#sample").hide(1000,function(){alert("段落被成功隐藏了");});});});</script>
</body>
</html>

效果:

可以看到在动画完成后,弹窗才会出现

七.chaining绑定

7.1chaining介绍

JQuery允许我们将方法链接起来,使用链接可以方便我们对某些方法的复用

例如:“假设我们有一个idp1的段落,我们想要它执行slideDown方法和slideUp方法”,我们可以很轻松的写出下面代码:

$("#p1").slideUp(1000);
$("#p1").slideDown(1000);

可以看到,我们写了两条语句,让这个元素执行这个两个功能

但是如果一个元素需要执行非常多的功能,假设有100个,我们就要写100条语句,这对于“程序员”来说很不方便!

为此,我们可以使用链接来简化书写!

7.2chaining使用方法

chaining使用方法:

  • $(selector).方法1.方法2.方法3.方法4.....

 7.3案例演示

下面的例子:

将css(),slideUp(),sildeDown()链接在p1上

<!DOCTYPE html>
<html>
<head>
<script src="/jquery/jquery-1.11.1.min.js"></script>
<script>
$(document).ready(function(){$("button").click(function(){$("#p1").css("color","red").slideUp(2000).slideDown(2000);});
});
</script>
</head><body><p id="p1">jQuery 乐趣十足!</p>
<button>点击这里</button></body>
</html>

效果:

点击后p1会“依次”执行:“css()”、“slideUp”、“slideDown

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/822621.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

音频---数字mic

一、常见的数字mic pdm麦通过codec芯片将数字麦转换为i2s信号输入到SOC 纯pdm麦就是直接进入SOC的pdm接口&#xff0c;走的是PDM信号&#xff0c;PDM信号就是两个线&#xff0c;一根数据线一根时钟线&#xff08;如顺芯ES7201/7202把MIC信号转换成PDM&#xff09;。 二、DMIC…

pixhawk控制板的ArduPilot固件编译

0. 环境 - ubuntu18&#xff08;依赖python2和pip&#xff0c;建议直接ubuntu18不用最新的&#xff09; - pixhawk 2.4.8 - pixhawk 4 1. 获取源码 # 安装git sudo apt install git # 获取源码 cd ~/work git clone --recurse-submodules https://github.com/ArduPilot/a…

MDC使用手册精讲

MDC 背景&#xff1a; 线上排查问题时&#xff0c;请求在多个微服务之间进行调用&#xff0c;并发量较大的情况下&#xff0c;想跟踪某一个请求的链路&#xff0c;是需要花费一些时间才能梳理出来&#xff0c;而且还依赖于你的业务字段。而我们需要的是快速定位&#xff0c;快…

飞桨Ai(二)paddle使用CPU版本可以正常识别,切换为GPU版本时无法识别结果

一、问题描述&#xff1a; 刚开始用paddle的CPU版本&#xff0c;对训练好的模型进行推理&#xff0c;正常识别出想要的结果后来尝试使用paddle的GPU版本&#xff0c;然后发现识别出来是空的 二、系统思路&#xff1a; 最终系统环境如下&#xff1a; 系统&#xff1a;win10 …

window轻松使用k8s

Docker Desktop安装篇 1、win安装 1、下载安装包 https://www.docker.com/products/docker-desktop/ 官网下载安装包 2、配置win支持虚拟化 不勾选Hyper-V&#xff0c;它和Windows Subsystem for Linux (WSL) 是两套功能&#xff0c;这里不选他 3、安装WSL配置window支持lin…

采用4G、5G实现无线视频监控,流量过大费用高,如何降低网络流量?

目录 一、高清视频监控中使用的4G和5G介绍 &#xff08;一&#xff09;4G物联网卡&#xff1a; 1、数据传输与稳定性 2、应用与优势 &#xff08;二&#xff09;5G物联网卡&#xff1a; 1、数据传输与速率 2、应用场景 二、4G/5G流量池 三、视频监控的流量使用 …

Java之JVM、JUC面试题笔记(持续更新)

CountDownLatch和CyclicBarrier JUC 并发编程_juc并发编程-CSDN博客 java 类加载机制&#xff1f;如何实现自定义类加载器&#xff1f;findClass 与 loadClass 的区别&#xff1f; 在Java中&#xff0c;自定义类加载器通常是通过继承java.lang.ClassLoader类并重写其findClas…

全网短剧搜索源码+短剧API接口 短剧下载 热门短剧 全开源可二开

内容目录 一、详细介绍二、效果展示1.部分代码2.效果图展示 三、学习资料下载 一、详细介绍 pc端h5手机端全网短剧搜索前端源码分享 内含7000短剧资源(不支持在线播放&#xff09; 搜索API接口&#xff1a;文件内查看 全部短剧API接口&#xff1a;文件内查看 每日更新API接…

vs2019 - detected memory leak

文章目录 vs2019 - detected memory leak概述笔记vs2019 consolevs2019 MFC Dlg但是&#xff0c;工程大了之后&#xff0c;VS2019提示的就变了样整好的内存泄漏侦测头文件和实现my_debug_new_define.hmy_debug_new_define.cpp在所有.cpp文件入口处包含my_debug_new_define.h包含…

模板的进阶

目录 非类型模板参数 C11的静态数组容器-array 按需实例化 模板的特化 函数模板特化 类模板特化 全特化与偏特化 模板的分离编译 总结 非类型模板参数 基本概念&#xff1a;模板参数类型分为类类型模板参数和非类类型模板参数 类类型模板参数&#xff1a;跟在class…

Covalent Network(CQT)宣布推出面向 Cronos 生态的捐赠计划与 API 积分,为 Web3 创新赋能

为了促进 Web3 领域的创新&#xff0c;Covalent Network&#xff08;CQT&#xff09;宣布将其捐赠计划向 Cronos 生态系统中的开发者拓展。这一战略性举措&#xff0c;旨在通过向 Cronos 网络中基于 Covalent Network&#xff08;CQT&#xff09;API 构建的项目提供支持和资源&…

Java实现优先级队列(堆)

前言 在学习完二叉树的相关知识后&#xff0c;我们对数据结构有了更多的认识&#xff0c;本文将介绍到优先级队列(堆&#xff09; 1.优先级队列 1.1概念 前面介绍过队列&#xff0c;队列是一种先进先出(FIFO)的数据结构&#xff0c;但有些情况下&#xff0c;操作的数据可能…

Android 车载应用开发概述

前言 介绍 Android 车载应用开发 文章目录 前言一、Android Automotive OS 概述二、Android Automotive OS 架构三、常见的车载应用1、系统应用1&#xff09;SystemUI是什么开发工作 2&#xff09;Launcher是什么开发工作 3&#xff09;Settings是什么开发工作 4&#xff09;多…

使用undetected-chromedriver遇到的问题及解决方法,以及它使用SOCKS代理的问题

环境&#xff1a;python3.8.10 uc的安装方法&#xff1a; pip38 install undetected-chromedriver 上测试代码&#xff1a; import undetected_chromedriver as uc driver uc.Chrome() driver.get(https://www.baidu.com) driver.save_screenshot(baidu.png)报错&#xff…

【结构型模式】组合模式

一、组合模式概述 组合模式的定义与意图&#xff1a;将对象组合成树形结构来表现“整体/部分”层次结构。组合能让客户以一致的方式处理个别对象以及对象组合。&#xff08;对象结构型&#xff09; 组合模式分析&#xff1a; 1.当容器对象的某一个方法被调用时&#xff0c;将遍…

算法|基础算法|高精度算法

基础算法|位运算 1.高精度加法 2.高精度减法 3.高精度乘法 4.高精度除法 心有猛虎&#xff0c;细嗅蔷薇。你好朋友&#xff0c;这里是锅巴的C\C学习笔记&#xff0c;常言道&#xff0c;不积跬步无以至千里&#xff0c;希望有朝一日我们积累的滴水可以击穿顽石。 高精度加法 …

【C++学习】map和set

目录 一、关联式容器 二、键值对 三、树形结构的关联式容器 四、set 4.1 set的介绍 4.2 set的使用 4.2.1 set的模板参数列表 4.2.2 set的构造 4.2.3 set的容量 4.2.4 set修改操作 4.2.5 set的使用举例 五、map 5.1 map的介绍 5.2 map的使用 5.2.1 map的模板参数说…

7.C++:多态

一、 virtual关键字 //1.可以修饰原函数&#xff0c;为了完成虚函数的重写&#xff0c;满足多态的条件之一&#xff1b; //2.可以在菱形继承中&#xff0c;完成虚继承&#xff0c;解决数据冗余和二义性&#xff1b; 两个地方使用同一关键字&#xff0c;但二者间没有一点关联 二…

淘宝扭蛋机小程序开发:开启购物娱乐新纪元

在数字时代浪潮的推动下&#xff0c;小程序作为新兴的交互平台&#xff0c;正在不断引领着购物方式的革新。淘宝扭蛋机小程序的开发&#xff0c;便是这一变革中的一颗璀璨明星&#xff0c;它将传统扭蛋机的趣味与电商购物的便捷完美融合&#xff0c;为用户带来了前所未有的购物…

Weakly Supervised Audio-Visual Violence Detection 论文阅读

Weakly Supervised Audio-Visual Violence Detection 论文阅读 摘要III. METHODOLOGYA. Multimodal FusionB. Relation Modeling ModuleC. Training and Inference IV. EXPERIMENTSV. CONCLUSION阅读总结 文章信息&#xff1a; 发表于&#xff1a;IEEE TRANSACTIONS ON MULTIME…