1. 程式人生 > >關於scrollintoview()真的是有意思極了,結合普通tab切換一起看看

關於scrollintoview()真的是有意思極了,結合普通tab切換一起看看

會有 出現 動圖 技術 htm mage view gif 效果

scrollIntoView(alignWithTop) 是html5新特性中的一個元素,他主要是指滾動瀏覽器窗口或容器元素,以便在當前視窗的可見範圍看見當前元素。
alignWithTop是true或者是false哦。如果alignWithTop為true,或者省略它,窗口會盡可能滾動到自身頂部與元素頂部平齊。
我們見動圖
技術分享圖片

見代碼
技術分享圖片

scrollIntoView還可以實現類似於我們常見的tab切換的效果
技術分享圖片

一些具體的效果見動圖
技術分享圖片

代碼如下
技術分享圖片
技術分享圖片

使用scrollIntoView實現tab切換和直接使用jq實現tab切換會有什麽區別呢?我們來看一下jq中是怎麽實現tab切換的吧~~~
首先見動圖

技術分享圖片
我們再看看實現的代碼吧~
技術分享圖片
技術分享圖片
技術分享圖片

scrollIntoView實現tab切換與tab切換這兩種方法,其實區別就是scrollIntoView切換的內容在html頁面流上是存在的,
而tab切換的內容是不存在的,只有切換的時候才會出現。

關於scrollintoview()真的是有意思極了,結合普通tab切換一起看看