function myFunction(){
var x = document.getElementById('.right_window');
if (x.style.display === "none") {
x.style.display = "block";
} else {
x.style.display = "none";
}
}
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js" ></script>
<script src="scripts.js"></script>
<link rel="stylesheet" href="index.css" type="text/css">
<link href="https://fonts.googleapis.com/css?family=Mukta+Mahee" rel="stylesheet">
</head>
<body>
<div class="main">
<button onclick="myFunction()">Try it</button>
<div class="right_window">
<ul>
<li>Michael Jordan</li><br>
<li>Kobe Bryant</li><br>
<li>Lebron James</li><br>
<li>Stephen Curry</li><br>
<li>Dwyane Wade</li>
<li>Kevin Durant</li>
<li>Shaquille O'Neal</li>
<li>Scottie Pippen</li>
<li>Shaquille O'Neal</li>
<li>Russell Westbrook</li>
<li>Allen Iverson</li>
<li>Vince Carter</li>
<li>Marcin Gortat</li>
</ul>
</div>
</div>
<div class="footer">
</div>
</body>
</html>
body{
width:100%;
height:500vh;
margin:0;
}
.main{
width: 100%;
height: 100vh;
float: right;
background-color: darkgoldenrod;
}
.right_window{
width:19%;
float: right;
height:100vh;
background-color: cadetblue;
}
ul{
width: 19%;
list-style:none;
display:block;
height:100vh;
position: absolute;
margin:0 auto;
padding: 0;
}
li{
float: left;
width:100%;
height: 7.52vh;
line-height: 7vh;
text-align:center;
color:white;
font-size: 4vh;
list-style-type:none;
border-bottom:black solid 1px;
}
li:hover{
float: left;
width:100%;
height: 7.4vh;
line-height: 7vh;
text-align:center;
color:white;
font-size: 4vh;
list-style-type:none;
border-bottom:black solid 1px;
background-color: rgb(10, 10, 5);
}
.footer{
width:100%;
background-color: black;
height: 12vh;
position: relative;
top:500vh;
}
Wsuń /wysuń nie chce działać. Gdzieś musiałem zrobić jakiś błąd, którego nie widzę ?