一.jQuery動畫

1.1 基本效果

引數詳解

speed:三種預定速度之一的字串("slow","normal",or"fast")或表示動畫時長的毫秒數值(如：1000)
easing    : (Optional) 用來指定切換效果，預設是"swing"，可用引數"linear"
fn        : 在動畫完成時執行的函式，每個元素執行一次。

hide(speed,fn)		隱藏
show(speed,fn)		顯示
toggle(speed,fn)	切換

寬高(height/width padding),透明度(opacity)變化  最後變為display:none/block
 

1.2 滑動效果

slideDown([s],[e],[fn])      通過高度,上下padding變化（向下增大）來動態地顯示所有匹配的元素,隱藏
slideUp([s,[e],[fn]])        通過高度,上下padding變化（向上減小）來動態地隱藏所有匹配的元素,顯示
slideToggle([s],[e],[fn])    通過高度變化來切換所有匹配元素的可見性,切換

只有高度和padding變化

1.3淡入淡出效果

fadeIn([s],[e],[fn])        通過不透明度的變化來實現所有匹配元素的淡入效果
fadeOut([s],[e],[fn])       通過不透明度的變化來實現所有匹配元素的淡出效果
fadeToggle([s,[e],[fn]])    通過不透明度的變化來開關所有匹配元素的淡入和淡出效果
fadeTo([s],opacity,[e],[fn])把所有匹配元素的不透明度以漸進方式調整到指定的不透明度,opacity必須寫

只有opacity變化
 

1.4自定義動畫

animate(p,[s],[e],[fn])

引數詳解
params: 一組包含作為動畫屬性和終值的樣式屬性和及其值的物件
speed: 三種預定速度之一的字串("slow","normal", or "fast")或表示動畫時長的毫秒數值(如：1000)
easing: 要使用的擦除效果的名稱(需要外掛支援).預設jQuery提供"linear" 和 "swing".一般不設定
fn: 在動畫完成時執行的函式，每個元素執行一次。

1.5 動畫控制

stop([c],[j])		停止動畫       停止所有在指定元素上正在執行的動畫
delay(d,[q])   		延遲等待			設定一個延時來推遲執行佇列中之後的專案
finish([queue])		瞬間完成動畫     停止當前正在執行的動畫，刪除所有排隊的動畫，並完成匹配元素所有的動畫

is(':animated')  判斷是否執行動畫   返回布林值

if($('#box').is(':animated')){
            return false;
        }
 

1.6 jQuery外掛

1.6.1select2 下拉框搜尋外掛

1.6.2 datetimepicker 時間日期外掛

• 用法

  //設定語言
  $.datetimepicker.setLocale('zh');
  //呼叫外掛
  $(dom).datetimepicker({
    datepicker:,
    timepicker:,
    format:"Y-m-d H:i",
    value:，
    ....
  })
  

1.6.3 fullpage 全屏滾動外掛

• 用法

  <!--HTML部分-->
  <div id="fullpage>
      <div class="section"></div>
      <div class="section">
          <div class="slide"></div>
          <div class="slide"></div>
          <div class="slide"></div>
      </div>
      <div class="section"></div>
      <div class="section"></div>
  </div>
  自定義的導航 解除安裝包裹元素的外面
  
  <!--JS部分-->
  <script>
      $("#fullpage").fullpage({
        navigation: true,
        sectionsColor: []
        .....
      })
  </script>
  

1.6.4 lazyload 圖片懶載入

1.6.5 layer 彈窗外掛

• 用法

  layer.alert()
  layer.confirm()
  layer.msg()
  layer.load()
  layer.tips()
  layer.colse()
  layer.open({
    type: ,
    title: ,
    content: 
    ....
  })
  ...
  

1.6.7 nice validator 表單驗證s