Warning: file_get_contents(/data/phpspider/zhask/data//catemap/9/javascript/414.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
为什么不是';我的视差滚动JavaScript代码不工作吗?_Javascript_Html_Css_Youtube_Parallax.js - Fatal编程技术网

为什么不是';我的视差滚动JavaScript代码不工作吗?

为什么不是';我的视差滚动JavaScript代码不工作吗?,javascript,html,css,youtube,parallax.js,Javascript,Html,Css,Youtube,Parallax.js,我开始设计自己的网站,并在YouTube视频教程中学习如何使用JavaScript和CSS在Dreamweaver上编码运动视差滚动,所以我跟着视频做了它告诉我的一切,但我的代码仍然不起作用 我觉得我的JavaScript代码没有链接或其他东西,因为视频中以特定颜色突出显示的一些语法或变量没有为我突出显示。我的问题是什么 我把JavaScript也放在head标记中。。。这是.js代码 <script type="text/javascript"> var ypos, im

我开始设计自己的网站,并在YouTube视频教程中学习如何使用JavaScript和CSS在Dreamweaver上编码运动视差滚动,所以我跟着视频做了它告诉我的一切,但我的代码仍然不起作用

我觉得我的JavaScript代码没有链接或其他东西,因为视频中以特定颜色突出显示的一些语法或变量没有为我突出显示。我的问题是什么

我把JavaScript也放在head标记中。。。这是.js代码

<script type="text/javascript">
    var ypos, image;
    function parallex () {

        ypos = window.pageYOffset;
        image = document.getElementById('background');
        image.style.top = ypos * .4 + 'px';
    }
    window.addEventListener('scroll', parallex);

    </script>

var-ypos,图像;
函数平行(){
ypos=window.pageYOffset;
image=document.getElementById('background');
image.style.top=ypos*.4+'px';
}
window.addEventListener('scroll',parallex);
这是我所有的css代码

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>Bootstrap 101 Template</title>
    <link href="../Tezel's Website/css/bootstrap.min.css" rel="stylesheet">




    <style type="text/css">
    *{
    margin: 0px;
    padding: 0px;
    }

    #image{
        position: relative; 
        z-index: -1
    }


    #content{
        height: 750px; 
        width: 100%;
        margin-top: -10px;
        background-color:#4dbbac;
        position: relative; 
        z-index: 1; 
    }

    </style>


 <script type="text/javascript">
    var ypos, image;
    function parallex () {

        ypos = window.pageYOffset;
        image = document.getElementById('background');
        image.style.top = ypos * .4 + 'px';
    }
    window.addEventListener('scroll', parallex);

    </script>



  </head>


  <body>




  <img id = "background" src = "sky1.jpg" width = "100%" />

    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
    <script src="../Tezel's Website/js/bootstrap.min.js"></script>


    <div class = "main">
    <div id = "container">

    <div class = "header">




    <div id = "content"> 
    </div> 




    </div>

    </div>    
    </div>



  </body>
</html>

引导101模板
*{
边际:0px;
填充:0px;
}
#形象{
位置:相对位置;
z指数:-1
}
#内容{
高度:750px;
宽度:100%;
利润上限:-10px;
背景色:#4dbac;
位置:相对位置;
z指数:1;
}
var-ypos,图像;
函数平行(){
ypos=window.pageYOffset;
image=document.getElementById('background');
image.style.top=ypos*.4+'px';
}
window.addEventListener('scroll',parallex);

这看起来不太迷人:


检查是否已加载所有资源。单击鼠标右键,然后在浏览器中选中图元或检查图元。确保找到并加载了所有资源。

这看起来不太吸引人:


检查是否已加载所有资源。单击鼠标右键,然后在浏览器中选中图元或检查图元。确保找到并加载了所有资源。

嘿,我基本上在没有启动或任何东西的情况下启动了一个新的HTML文件,但它仍然不工作……您是否检查了加载的资源。。或者您在控制台中有任何错误吗?嗯,我将名称更改为“”,当我按control D时打开,因此源代码很好,但我解决了错误:)谢谢,但无论如何,我还是因为您学到了新东西!嘿,我基本上是在没有引导或任何东西的情况下启动了一个新的HTML文件,但它仍然不起作用……您是否检查了加载的资源。。或者您在控制台中有任何错误吗?嗯,我将名称更改为“”,当我按control D时打开,因此源代码很好,但我解决了错误:)谢谢,但无论如何,我还是因为您学到了新东西!