JQ动画函数

JQ动画函数

//设置单个样式：css(属性，属性值)；----js通过style属性来设置样式

//添加类名：addClass("类名")
//移出类名：removeClass("类名")
//判断是否存在这个类名：hasClass("类名")
//切换类：toggleClass("类名")


  //1. attr(标签属性)------用法和css(样式属性)一样
  
    //prop()---------对于bool类型的属性，不要用attr方法，用prop，因为：在jQuery1.6版本以后用attr方法就没有效果了，prop方法用法同attr（）



// //第一组：show()和hide():从左上角到右下角的一个过程
// //1. 不传入参数：没有动画效果
// //2. 传入一个参数：show(speed)
// //          speed:动画持续的时间，可以毫秒值，也可以是固定字符串
// //                 fast:200ms  normal:400ms  slow:600ms
// //3. 传入两个参数： show（[speed]，[callback]）



// // 第二组：slideUp()和slideDown()和slideToggle------滑入滑出，类似卷帘门：从上往下的一个过程
// // 1. 不传入参数：也有动画的效果，有一个默认的normal
// //2. 传入一个参数：slideDown(speed)
// //          speed:动画持续的时间，可以毫秒值，也可以是固定字符串
// //                 fast:200ms  normal:400ms  slow:600ms
// //3. 传入两个参数： slideDown（[speed]，[callback]）
// //          callback:动画成功后的回调函数

/*
* animate();
* 第一个参数： 对象，里面放的是需要的动画的样式
* 第二个参数： speed，动画执行的时间
* 第三个参数：动画执行的效果， linear swing
* 第四个参数：回调函数
* */

//mouseover：鼠标经过事件
//mouseout:鼠标离开事件

        //mouseenter: 鼠标进入事件
        //mouseleave: 鼠标离开事件

        //如果没有子级元素，两类事件都可以实现，需要注意：如果有子级元素，mouseover系列有冒泡事件


//第一个参数：clearQueue:是否清除动画队列
        //                      true:直接停止动画 false:当前的动画停止，执行动画队列中的下一个动画
        //第二个参数：jumpToEnd：是否跳转到最终的动画效果
        //                      true:直接跳转到最终的动画效果 false:不跳转到最终效果

//jquery创建元素：
//1. 创建jquery对象 $(“标签+内容”)
//2. 将jquery对象追加到父元素中去 append
var $a = $(‘这是一个a标签’);

// //2.1  向父容器中往后追加子元素 append
// $("#box").append($a);

// //2.2  将子元素往后追加到父容器中  appendTo
// $a.appendTo($("#box"));

// //2.3 向父容器前添加子元素 prepend
// $("#box").prepend($a);

// // 2.4 将子元素从前面添加到父容器中  prependTo
// $a.prependTo($("#box"));

//=================================================
//在box后面添加一个a标签
// $("#box").after($a);
//在box前面添加一个a标签
$("#box").before($a);