$(function(){
var $window = $(window),
$header = $('.header'),
$this = $(this); // <-----here you can cache your selectors
$window.on('scroll', function(){
if($this.scrollTop() > 0){
$header.addClass('shadow');
}else{
$header.removeClass('shadow');
}
}).scroll();
});
var update = function (modifier) {
if (38 in keysDown) { // Player holding up
hero.y -= hero.speed * modifier;
}
if (40 in keysDown) { // Player holding down
hero.y += hero.speed * modifier;
}
if (37 in keysDown) { // Player holding left
hero.x -= hero.speed * modifier;
}
if (39 in keysDown) { // Player holding right
hero.x += hero.speed * modifier;
}
// Are they touching?
if (
hero.x <= (monster.x + 32)
&& monster.x <= (hero.x + 32)
&& hero.y <= (monster.y + 32)
&& monster.y <= (hero.y + 32)
) {
++monstersCaught;
reset();
}
if(hero.x <= 0){
hero.x = 0;
}
else if(isMaxWidth()){
hero.x = canvas.width -32
}
if(hero.y <= 0){
hero.y = 0;
}
else if(isMaxHeight()){
hero.y = canvas.height -32
}
};
var isMaxWidth = function(){
return hero.x >= canvas.width - 32;
};
var isMaxHeight = function(){
return hero.y >= canvas.height - 32;
};
.shadow{
box-shadow: 0px 3px 5px #888888;
}
0 <= x < window.innerHeight