web前端入门到实战： jQuery的淡入淡出

最新推荐文章于 2021-12-09 09:15:51 发布

魔方编程

最新推荐文章于 2021-12-09 09:15:51 发布

阅读量297

点赞数

文章标签：前端 web前端 jquery 前端开发前端教程

本文链接：https://blog.csdn.net/wewfdf/article/details/100701307

版权

本文介绍了jQuery中实现元素淡入淡出的四个方法：fadeIn(), fadeOut(), fadeToggle() 和 fadeTo()。fadeIn()用于淡入隐藏元素，fadeOut()用于淡出，fadeToggle()在两者间切换，fadeTo()则可指定不透明度变化。适合前端初学者学习。" 113175227,10619645,C语言实现数据结构：双链表操作详解,"['数据结构', '链表', 'C语言']

摘要由CSDN通过智能技术生成

在jQuery中的一些特效中，可以通过四个方法来实现元素的淡入淡出，这四个方法分别是：fadeIn()、fadeOut()、fadeToggle() 以及 fadeTo()，下面为分别为大家介绍各个方式的使用。

jQuery fadeIn() 用于淡入已经被隐藏的元素，例子：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>jquery淡入</title>
    <style>
        *{margin:0;padding:0;}
         div{width:50px;height:50px;margin:10px;display:none;}
         #div1{background: green;}
         #div2{background: orange;}
         #div3{background: yellow;}
    </style>
    <!-- jquery自己引入就好，我这里的是jquery-1.12.0.min.js -->
    <script type="text/javascript" src="jquery-1.12.0.min.js"></script>
      <script type="text/javascript">
           $(document).ready(function(){
           $("button").click(function(){
                    $("#div1").fadeIn();
                     $("#di

最低0.47元/天解锁文章

魔方编程

关注

0
点赞
踩
1

收藏

觉得还不错? 一键收藏
0
评论
web前端入门到实战： jQuery的淡入淡出

在jQuery中的一些特效中，可以通过四个方法来实现元素的淡入淡出，这四个方法分别是：fadeIn()、fadeOut()、fadeToggle() 以及 fadeTo()，下面为分别为大家介绍各个方式的使用。jQuery fadeIn() 用于淡入已经被隐藏的元素，例子：<!DOCTYPE html><html lang="en"><head> ...
复制链接

扫一扫