Yesjo1 Ответов: 1

Как мне сделать так, чтобы мое меню шло вместе с моей страницей?


Я хочу, чтобы при прокрутке мое меню шло вместе с моей страницей.
/* 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
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
<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

Что я уже пробовал:

положение:фиксированное;
Я могу использовать его неправильно. скажите мне, где его использовать, если да.

1 Ответов

Рейтинг:
9

Kornfeld Eliyahu Peter

Читайте об этом position[^] из CSS...


Yesjo1

спасибо. это помогло, но не полностью. Теперь он показывает только каждый пункт меню в одном месте.

Yesjo1

У меня есть кое-что, что сработало. позиция:липкая; работает, но позиция:фиксированная; нет. Не знаю почему, но все равно спасибо.