• 課程時長

    6 小時 14 分

  • 課程級別

    初級

  • 授課語言

    中文

這堂課你將會學到

  • 動態頁籤切換
  • 隱藏選單、動態更換頁面背景顏色
  • 燈箱廣告實作
  • 讓網頁頁面滑到指定的位置

章節目錄

  • 1

    第 1 章 不囉嗦！直接用！

    • 單元 1 - jQuery版本說明

    • 單元 2 - jQuery文件的導入

    • 單元 3 - 執行jQuery必做的：$(document).ready(function){}

    • 單元 4 - 原來是這樣：jQuery選擇器說明

    • 單元 5 - 第一個jQuery互動完成！
  • 2

    第 2 章 jQuery還有哪些好玩的東西?

    • 單元 1 - 顯示隱藏區塊:hide(), show()

    • 單元 2 - 顯示隱藏區塊進階說明：toggle() 和設定速度

    • 單元 3 - 點點圖片淡入淡出：fadeIn(), fadeOut()

    • 單元 4 - 點點圖片淡入淡出進階說明： fadeToggle(), fadeTo()

    • 單元 5 - 滑動的內容更有趣：slideDown(), slideUp(), slideToggle()

    • 單元 6 - 讓div動起來：animate()
  • 3

    第 3 章 jQuery與Html的親密關係

    • 單元 1 - 取得跟修改文字內容：text()

    • 單元 2 - 取得跟修改網頁內容：html()

    • 單元 3 - 取得跟修改欄位內容： val()

    • 單元 4 - 取得跟修改屬性值：attr()

    • 單元 5 - (一)插隊一下！新增網頁元素：append(), prepend()

    • 單元 6 - (二)插隊一下！新增網頁元素：after(), before()
  • 4

    第 4 章 jQuery與Css的曖昧關係

    • 單元 1 - 把類別class塞進去：addClass()

    • 單元 2 - 把類別class拉出來：removeClass(), toggleClass()

    • 單元 3 - 無中生有：css()

    • 單元 4 - 大大小小我自己來：jQuery 控制尺寸
  • 5

    第 5 章 讓jQuery帶你看Html的祖譜

    • 單元 1 - jQuery幫忙往上找長輩：parent(), parents(), parentsUntil()

    • 單元 2 - jQuery幫忙往下找孫子：children(), find()

    • 單元 3 - Html元素同輩怎麼找? siblings(), next(),nextAll(), nextUntil(), prev(), prevAll(), prevUntil()

    • 單元 4 - jQuery怎麼找同輩：prev() prevAll() prevUntil()

    • 單元 5 - 過濾一下親戚：first(), last(), eq(), filter(), not()
  • 6

    第 6 章 jQuery其他好玩的地方

    • 單元 1 - jQuery回調：CallBack

    • 單元 2 - jQuery的連續寫法

    • 單元 3 - $(this)指的是自己

    • 單元 4 - 解決jQuery衝突的方法：noConflict()

    • 單元 5 - jQuery選擇器深入說明
  • 7

    第 7 章 jQuery的實戰應用

    • 單元 1 - 有趣的動態頁籤切換(一)

    • 單元 2 - 有趣的動態頁籤切換(二)

    • 單元 3 - 有趣的動態頁籤切換(三)

    • 單元 4 - jqery隱藏選單+更換頁面背景顏色(一)

    • 單元 5 - jqery隱藏選單+更換頁面背景顏色(二)

    • 單元 6 - 頁面滑動到指定位置(一)

    • 單元 7 - 頁面滑動到指定位置(二)

    • 單元 8 - 燈箱廣告：lightbox(一)

    • 單元 9 - 燈箱廣告：lightbox(二)