Я пробовал этот эффект прокрутки прокрутки javascript, изображение меняет цвет, когда объект прокручивается над ним, и у меня есть весь код точно такой же, как и у учебника, за исключением того, что javascript не срабатывает? This is the tutorial I used. Вот HTML У меня есть:Javascript wont fire?
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Slip Scroll</title>
<link rel="stylesheet" href="style.css">
</head>
<body>
<div class="container dark">
<img src="images/logogreen.svg" class="default" height="200px">
</div>
<div class="container light">
<img src="images/logopink.svg" class="moveable" height="200px">
</div>
<div class="container dark">
<img src="images/logogreen.svg" class="moveable" height="200px">
</div>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="js/slipScroll.js"></script>
</body>
</html>
Вот JavaScript им с помощью:
var setLogo = function() {
$('.moveable').each(function() {
$(this).css('top',
$('.default').offset().top -
$(this).closest('.container').offset().top
);
});
};
$(document).scroll(function() {
setLogo();
});
setLogo();
Вы не хватает своего 'px' из верхней CSS. Кроме того, обязательно запустите его после загрузки окна. – juvian
. Вам не хватает PX в верхней части и почему бы не использовать .parent() вместо ближайшего() –
Что скажет консоль F12 – loveNoHate