Javascript不会开火吗？_Javascript_Jquery_Html_Css

Javascript不会开火吗？

javascript jquery html css

Javascript不会开火吗？,javascript,jquery,html,css,Javascript,Jquery,Html,Css,我正在尝试这个javascript滑动滚动效果，当一个对象在图像上滚动时，图像会改变颜色，我的所有代码与教程完全相同，除了javascript不会启动？以下是我得到的html： <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Slip Scroll</title> <link rel="styleshe

我正在尝试这个javascript滑动滚动效果，当一个对象在图像上滚动时，图像会改变颜色，我的所有代码与教程完全相同，除了javascript不会启动？以下是我得到的html：

<!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>

在这条线上，你正试图

Int-Int+string

这可能会导致问题，因此需要：

        ($('.default').offset().top - $(this).closest('.container').offset().top).toString + 'px'

你添加css了吗

用背景色更新-

您缺少顶部css中的

px

。另外，请确保在窗口加载后运行它。如果顶部缺少PX，为什么不使用.parent（）而不是closest（）。控制台上说F12缺少PX不会导致出现问题。在

top

-property（以及许多其他属性）上，jQuery在内部将“px”添加到一个数值。

        $('.default').offset().top - $(this).closest('.container').offset().top + 'px'

        ($('.default').offset().top - $(this).closest('.container').offset().top).toString + 'px'

 .dark { 
  background: #333;
 }

.light {
 background: #fff;
 }

.container {
 overflow: hidden;
 position: relative;
 min-height: 500px;
padding: 1em;
}
.default {
position: fixed;
}

.moveable {
 position: absolute;
}