Reputation: 13
So, it's my first time designing a website and I'm trying out something:
1) When the page loads, the page is filled with an image.
2) When the user scrolls down, past the image, the menubar will become fixed.
Now I was able to make this work a few days ago. I tried adding a few things just now but the jQuery code I used stopped working. I removed my changes but it still isn't working properly.
I'll leave the CSS and jQuery codes here I guess
CSS
#homepic {
height: 100%;
width: 100%;
background-image: url(images/a.png);
background-size: cover;
background-repeat: no-repeat;
background-position: center;
background-attachment: fixed;
}
.menubar {
height: 60px;
width: 100%;
background-color: rgba(0,0,0,0.5);
}
.fixed {
position: fixed;
top: 0;
}
#blah {
height: 1000px;
width: 100%;
margin: 10px 10px 10px 10px;
}
jQuery
$(window).scroll(function () {
var windowHeight = window.innerHeight;
($(window).scrollTop() > windowHeight) ? $(‘.menubar').addClass(‘fixed') : $(‘.menubar').removeClass(‘fixed');
});
Please let me know if I'm doing anything wrong. I don't know much about this yet. Thanks!
EDIT. Okay, after posting my question I noticed that my apostrophes were auto formatted to single quotation marks. My bad. Sorry for this dumb question XD
Upvotes: 1
Views: 35
Reputation: 4849
I think you have copied the JS from somewhere, Try replacing it with this.
$(window).scroll(function () {
var windowHeight = window.innerHeight;
($(window).scrollTop() > windowHeight) ? $('.menubar').addClass('fixed') : $('.menubar').removeClass('fixed');
});
Upvotes: 0
Reputation: 847
The first quote in $(‘.menubar')
is not a real quote .
This will work:
$(window).scroll(function () {
var windowHeight = window.innerHeight;
($(window).scrollTop() > windowHeight) ? $('.menubar').addClass(‘fixed') : $(‘.menubar').removeClass(‘fixed');
});
Edit: same for .addClass and .removeClass
Upvotes: 1
Reputation: 1475
It's the strange quote-mark in .addClass()
, the same in .removeClass()
. The very first quote-mark in each one. It should be an apostrophe or a double quote-mark
Upvotes: 1