如何使我的菜单与我的页面一起使用？ [英] How do I make it so that my menu goes with my page?

问题描述

我想滚动时，我的菜单会与我的页面一起显示。

I want to, when you scroll, that my menu goes with my page.

/* Set height of body and the document to 100% */
body, html, div {
    font-family: Arial;
	color: black;
}

/*tab style*/
.tab {
	float: left;
    background-color: #f1f1f1;
    width: 9%;
}

.tablink:hover {
    background-color: #777;
}


/* style tab inhoud */
.tabcontent {
    display: none;
	padding: 10px 170px;
	width: 1680px;
	height: 1050px;
	float: left;
}

/*style for buttons*/
.tab button {
	display: block;
    background-color: inherit;
    color: black;
    padding: 22px 16px;
    border: none;
    outline: none;
    text-align: left;
    cursor: pointer;
    transition: 0.3s;
	}

#Start {
	background-color: red;
}
#Photoshop {
	background-color: green;
}
#Inhoud {
	background-color: orange;
}
#Afsluiting {
	background-color: blue;
}
img {
    width: 650px;
    height: auto;
	border: 1px solid black;
}

^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ ^^

CSS代码

^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
CSS code

var naam = prompt ("Hallo, wat is je naam?");
function openPage(pageName,elmnt,color) {
    var i, tabcontent, tablinks;
    tabcontent = document.getElementsByClassName("tabcontent");
    for (i = 0; i < tabcontent.length; i++) {
        tabcontent[i].style.display = "none";
    }
    tablinks = document.getElementsByClassName("tablink");
    for (i = 0; i < tablinks.length; i++) {
        tablinks[i].style.backgroundColor = "";
    }
    document.getElementById(pageName).style.display = "block";
    elmnt.style.backgroundColor = color;

}
document.getElementById("defaultOpen").click();
document.getElementsByClassName("tablink")[0].click()

^^^^^^^^^^^^^^^^ ^^^^^^^^^^^^^^^^^^^^

javascript代码

^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
javascript code

<noscript> Hallo, deze site gebruikt javascript. Gebruik google chrome of schakel Java in. </noscript>
	<div class="tab">
		<button class="tablink" onclick="openPage('Start', this, 'red')"id="defaultOpen">Start</button>
		<button class="tablink" onclick="openPage('Photoshop', this, 'green')">Photoshop</button>
		<button class="tablink" onclick="openPage('Inhoud', this, 'orange')">Inhoud</button>
		<button class="tablink" onclick="openPage('Afsluiting', this, 'blue')">Afsluiting</button>

^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^

（相关）HTML代码

对不起我糟糕的编码。我只是一名高中生，正在从事一项需要在2天内完成的项目。求助：D



我的尝试：



职位：已修复;

我可能无法正确使用它。告诉我在哪里使用它。

^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
(relevant) HTML code
sorry for my terrible coding. I am just a high school student working on a project that needs to be finished in 2 days. Help please :D

What I have tried:

position:fixed;
I might not use it correctly. tell me where to use it if so.

推荐答案

了解 position [ ^ ]

这篇关于如何使我的菜单与我的页面一起使用？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！