Advertisement
Not a member of Pastebin yet?
Sign Up,
it unlocks many cool features!
- <div class="navbar">
- <h3>OmniFoods</h3>
- <a href="#home">Home</a>
- <a href="#about">About</a>
- <a href="#contact">Contact</a>
- </div>
- .navbar {
- height: 50px;
- width: 100%;
- font-family: Arial;
- position: fixed;
- background: transparent;
- color: #fff;
- top: 0;
- left: 0;
- }
- .navbar h3 {
- float: left;
- margin-left: 30px;
- margin-top: 20px;
- }
- .navbar a {
- float: right;
- padding: 18px;
- margin-right: 30px;
- text-decoration: none;
- color: #333;
- }
- window.onscroll = function() {
- var navbar = document.getElementsByClassName('navbar')[0];
- if(window.pageYOffset > 100) {
- navbar.style.background = "#fff";
- }
- else {
- navbar.style.background = "transparent";
- }
- }
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement