整合營銷服務商
電腦端+手機端+微信端=數據同步管理
免費咨詢熱線：
電腦端+手機端+微信端=數據同步管理
免費咨詢熱線：
avaScript
在我們制作html網頁的時候，有時候需要某個元素（比如說div）的滾動條一直在最下方，那么我們該怎么做呢？
先上代碼：
window.onload = SetScroll;// 不要括號
function SetScroll(){
//讀取需要設定的元素高度
var height=$("#showwindows")[0].scrollHeight;
//設置元素的滾動條位置在高度數據地方就是最下方
$("#showwindows").scrollTop(height);
}
程序執行流程如下：
1、頁面加載時自動調用JavaScript中的SetScroll方法；
2、設置height為需要設置滾動條元素的高度；
3、設置元素的滾動條位置為元素高度，就是元素的最下方位置。
到頂部的功能現在基本上是網頁的標配了，當你已經瀏覽到頁面底部時，一鍵返回頂部的功能確實非常方便。隨著用戶習慣的養成，這個功能都是頁面必備的。那么作為一個前端開發者，我們如何實現這個實用又酷炫的功能呢？今天小編幫大家匯總了五種實現方法，覺得有用記得點贊，轉發哦。
使用錨點鏈接是一種簡單的返回頂部的功能實現。該實現主要在頁面頂部放置一個指定名稱的錨點，然后在頁面下方放置一個返回到該錨點的鏈接，用戶點擊該鏈接即可返回到該錨點所在的位置。原理和實現都很簡單，核心就是通過錨點跳轉到指定元素位置，然后把要跳轉的元素放到頁面頂部。
scrollTop屬性表示被隱藏在內容區域上方的像素數。元素未滾動時，scrollTop的值為0，如果元素被垂直滾動了，scrollTop的值大于0，且表示元素上方不可見內容的像素寬度。可以利用scrollTop來實現回到頂部的功能，修改body的scrollTop。示例如下：
scrollTo(x,y)是js原生的方法，作用是滾動當前window中顯示的文檔至（x,y）點。這是很常用的一種方法，設置scrollTo(0,0)就可以實現回到頂部的效果。示例如下：
scrollBy(x,y)方法滾動當前window中顯示的文檔，x和y指定滾動的相對量。只要把當前頁面的滾動長度作為參數，逆向滾動，則可以實現回到頂部的效果。
5.scrollIntoView()
Element.scrollIntoView方法可以滾動當前元素，使其進入瀏覽器的可見區域。該方法可以接受一個布爾值作為參數。如果為true，表示元素的頂部與當前區域的可見部分的頂部對齊（前提是當前區域可滾動）；如果為false，表示元素的底部與當前區域的可見部分的尾部對齊（前提是當前區域可滾動）。如果沒有提供該參數，默認為true。
使用該方法的原理與使用錨點的原理類似，在頁面最上方設置目標元素，當頁面滾動時，目標元素被滾動到頁面區域以外，點擊回到頂部按鈕，使目標元素重新回到原來位置，則達到預期效果。
關于實現回到頂部功能的方法就和大家分享到這里，希望能對你的工作有幫助。如果你覺得本篇文章對你有幫助，歡迎點贊，評論，轉發。
高興鐵鐵們能來看html網頁設計第二期~~~~撒花~~~~~
哎呀呀~實在是抱歉備注標簽我記錯了QAQ
<!--內容打這里-->這個才是備注標簽不是//
首先我們先來學習上節課留下的劇透，分別是:
有人就說了標題標簽上次劇透不就只有h1標簽嗎?
嘿嘿，其實他還有兄弟姐妹啦~
看圖，代碼是從上往下從左往右執行的請記住這個順序哦~
還有,左邊是代碼右邊是網頁上面的效果哦~
源代碼:
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>頁面標題</title>
</head>
<body>
<!--標題標簽是h1~h6-->
<h1>1</h1><!--最大-->
<h2>2</h2>
<h3>3</h3>
<h4>4</h4>
<h5>5</h5>
<h6>6</h6><!--最小-->
</body>
</html>
如圖所示，h1標簽是最大的，h6標簽是最小的
是不是很簡單呀,現在已經學會了一個知識點了哦~
源代碼:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
</head>
<body>
<!--千萬要記住內容是寫在標簽里面的哦~-->
<!--段落標簽是獨占一條的哦-->
<p>第一條p標簽</p>
<p>第二條p標簽</p>
<p>第三條p標簽</p>
</body>
</html>
鏈接標簽是什么?顧名思義就是一個鏈接看代碼：
<a href="https://www.baidu.com">百度</a>
href是什么東西啊？是a標簽的屬性啦~里面用來輸入你需要跳轉到的網頁的鏈接
屬性里面的東西是不會出現在網頁上面的出現的只有在a標簽里面的內容哦
當我點擊百度這兩個字后就給我跳轉到了我們href屬性里面的https://www.baidu.com
當然我們也可以跳轉到我們自己制作的網頁上面但要求是同一個項目下面的網頁
是不是很有趣~
看視頻:
<script src="https://lf6-cdn-tos.bytescm.com/obj/cdn-static-resource/tt_player/tt.player.js?v=20160723"></script>
視頻中我們點擊鏈接后就跳轉到了山這個網頁出現了一張山的圖片，是不是有點小意思~
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
</head>
<body>
<a href="new_file3.html">跳轉到山的網頁</a><!--只有同一個項目下面的網頁才能相互跳轉-->
</body>
</html>
圖像標簽標簽如其意，就是用來上傳圖像的一個標簽~~
我們這里介紹一下img的兩個屬性:
<img src="img/OIP-C.jpg" alt="山"/>
src就是用來放圖片的地址的，他會根據地址去找圖片然后把圖片放到網頁上面。
alt有什么用啊就是當圖片顯示失敗的時候就會顯示alt里面的文字
看視頻:
<script src="https://lf6-cdn-tos.bytescm.com/obj/cdn-static-resource/tt_player/tt.player.js?v=20160723"></script>
我們把圖片的地址破壞后，就會顯示一個圖片錯誤的圖標和alt里面的內容
怎么拖圖片到img文件下，老師~~~我不知道
看視頻
<script src="https://lf6-cdn-tos.bytescm.com/obj/cdn-static-resource/tt_player/tt.player.js?v=20160723"></script>
嘿嘿就直接把文件拖進來就ok了是不是很簡單~
okk，好快啊怎么一下就學完了今天的知識點~~~
嘻嘻今天可是有作業的~
請根據下面的網頁仿寫一下:
完成后作業發再評論區哦，有什么不懂的可以留言包回答的。
加油呀，每天學一點爭取做出屬于自己的一個網頁~
上一期
*請認真填寫需求信息，我們會在24小時內與您取得聯系。
