part6 課程介紹
scroll系列:-----重點,每個屬性是什么意思 封裝scroll系列的相關的屬性,固定導航欄案例---事件瀏覽器的滾動條事件--能夠寫出來 封裝影片函式---緩動影片---變速影片--- 筋斗云 獲取元素計算后的樣式屬性值 升級變速影片--------------理解---能夠自己寫出最終版本的函式 手風琴案例 開機影片案例 旋轉木馬案例 另一個系列 圖片跟著滑鼠飛------part5 復習
定時器:兩個 setInterval(函式,時間);//定時器,隔一段時間就執行一次函式的代碼 clearInterval(定時器的id); setTimeout(函式,時間);//定時器,只執行一次函式的代碼-----一次性的定時器 clearTimeout(定時器的id);// 影片函式:* offset系列: 獲取元素的相關的樣式屬性的值 offsetWidth:獲取元素的寬 offsetHeight:獲取元素的高 offsetLeft:獲取元素距離左邊位置的值 offsetTop:獲取元素距離上面位置的值** 完整輪播圖: 1. 根據ul中li個數(圖片的個數)動態的創建li,并且加入到ol中,作為小按鈕來使用 為每個ol中的li添加滑鼠進入的事件,(添加事件之前,先把索引保存在每個li的自定義屬性中),滑鼠進入li的時候做排他功能(背景顏色),移動圖片(圖片整體移動,移動的ul,每次移動的是一個圖片的寬度,圖片的寬度就是向寬的寬度),呼叫的是影片函式,移動ul,移動的是索引值*圖片的寬度,并且把索引值存盤在一個全域變數中,pic 2. 創建li之后,1---設定ol中第一個li有默認的背景顏色,2---把ul中的第一個li克隆一下(無縫連接的效果)追加到ul中所有的li的最后面(無縫效果:頁面中的第一個圖片和最后一個圖片是同一個圖片)* 3.左右焦點的div顯示和隱藏 4.為左右按鈕注冊點擊事件 每一次點擊右邊的按鈕,先判斷pic的值是不是ul中li的length-1(pic的值最大是5),此時設定pic的值為0,同時設定ul距離左邊的left值為0(初始值),此時pic立刻加1,移動ul,用戶看到的就是第二個圖片 設定小按鈕的背景顏色 左邊按鈕,需要判斷pic值是不是0,如果是0此時pic=5,ul的left為5*圖片的寬,立刻pic-1,然后ul移動一張圖片,此時用戶看到了第五個圖片* 5.自動播放在頁面加載的時候,啟動一個定時器,里面呼叫的就是右邊按鈕的點擊事件的處理函式** BOM中頂級物件:Window DOM中頂級物件:Document jQuery中頂級物件:$--jQuery轉載請註明出處，本文鏈接：https://www.uj5u.com/qiye/163307.html
標籤：JavaScript