0
如何根據滾動離開設置菜單?如何留下伴隨滾動條的菜單?
我做了一段代碼來說明代碼。當我滾動他所在的頁面時,我打開菜單。我想要菜單跟蹤滾動頁面。
我該怎麼做?
\t \t var nav = document.getElementById("menu");
\t \t var showMenu = document.getElementById("abrir");
\t \t var hideMenu = document.getElementById("fechar");
\t \t showMenu.addEventListener("click", function() {
\t \t nav.classList.add("show");
\t \t });
\t \t hideMenu.addEventListener("click", function() {
\t \t nav.classList.remove("show");
\t \t });
\t html, body{
\t \t padding: 0;
\t \t margin: 0;
\t \t width: 100%;
\t \t height: 100%;
\t } \t
\t #site{ \t \t
\t \t position: absolute;
\t \t width: 100%;
\t \t height: 500px;
\t \t
\t }
\t #fundo_site{
\t \t position: absolute;
\t \t width: 100%;
\t \t height: auto;
\t }
\t #menu{
\t \t position: absolute;
\t \t left: -292px;
\t \t height:100%;
\t \t width:15%;
\t \t transition: left 0.5s linear;
\t }
\t #img_menu{
\t \t width: 100%;
\t \t height: 100%;
\t }
\t #menu.show{
\t \t left:0;
\t }
\t #bt_menu{
\t \t width:20%;
\t \t height:20%;
\t \t margin: 15px;
\t }
\t p{
\t \t font-family: 'Raleway', sans-serif; \t \t \t
\t \t font-size: 20px;
\t \t color: black;
\t \t left: 10px;
\t \t top: -5px;
\t }
<!DOCTYPE html>
<html>
<head>
\t <title>Meu Site</title>
\t \t <link href='https://fonts.googleapis.com/css?family=Raleway:200' rel='stylesheet' type='text/css'>
\t \t
\t
</head>
<body>
\t
\t <div id="site">
\t \t \t <img id="fundo_site" src="http://i.stack.imgur.com/gINau.jpg.jpg">
\t \t \t <a id="abrir" style="position:absolute;"> <img id="bt_menu" src="img/bt.png"></a>
\t </div>
\t
\t <div id="menu"> \t \t
\t \t <p id="fechar" style="position:absolute;"><strong>X</strong></p>
\t \t <img id="img_menu" src="http://i.stack.imgur.com/DiAvt.jpg.jpg">
\t </div>
\t
</body>
</html>
第一步是找出一些Web開發和編程術語Zkk。舉個例子,在我看完你的問題兩次之後,我不知道你在問什麼。我通常被認爲是一個經驗豐富的全棧開發人員。 –
打開側面菜單並向下滾動頁面!你會看到菜單保留在頁面的頂部。我想,當你滾動頁面時,將菜單放在一起!我想要菜單伴隨着滾動頁面。 – Zkk