zoukankan      html  css  js  c++  java
  • jQuery中的动画

             1.控制元素的显示及隐藏

                      show( )控制元素的显示,hide( )控制元素的隐藏

         例子:
             $("element").show("slow");

             2.改变元素的透明度

                      fadeIn( )fadeOut( )可以通过改变元素的透明度实现淡入淡出效果

                   例子:

              $("#panel h5.head").toggle(function(){
                  $(this).next("div.content").fadeOut();
                },function(){
                  $(this).next("div.content").fadeIn();
                   });

             3.改变元素的高度

                      slideDown( )可以使元素逐步延伸显示   slideUp( )则使元素逐步缩短直至隐藏

                 例子:

            $("#panel h5.head").toggle(function(){
                  $(this).next("div.content").slideUp();
             },function(){
                  $(this).next("div.content").slideDown();
                });

             4.自定义动画

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

             5.注:

                 1.对比fadeIn()与show(),slideDown()的区别          

                      .show('duration')和.hide('duration') 是长度、宽度、透明度三个属性一起变化;

                    fadeIn()/fodeOut是设置好了盒子的尺寸,变化透明度(所以用户看到页面会跳一下);

                    slideDown()/slideUp() 仅改变元素的高度;(过渡自然)

                 2.mouseover和mouseenter的区别

                        mouseover事件会冒泡,这意味着,鼠标移到其后代元素上时会触发。

                    mouseenter事件不冒泡,这意味着,鼠标移到其后代元素上时不会触发

  • 相关阅读:
    Spring--之旅
    体验 Windows 系统 CVM
    基于 CentOS 搭建 WordPress 个人博客
    Codeforces Round #316 (Div. 2)
    BZOJ 1048 [HAOI2007]分割矩阵
    BZOJ 1047 [HAOI2007]理想的正方形
    BZOJ 1045 [HAOI2008] 糖果传递
    BZOJ 1042 [HAOI2008]硬币购物
    BZOJ 1030 [JSOI2007]文本生成器
    BZOJ 第二波刷题开始喽
  • 原文地址:https://www.cnblogs.com/yangshuwen/p/13216214.html
Copyright © 2011-2022 走看看