Javascript Jquery滑块在我的第一个网站上不工作？_Javascript_Jquery_Html_Css

Javascript Jquery滑块在我的第一个网站上不工作？

javascript jquery html css

Javascript Jquery滑块在我的第一个网站上不工作？,javascript,jquery,html,css,Javascript,Jquery,Html,Css,就在几个小时前，我开始创建我的第一个网站（目前还不完整），并偶然发现了这个问题。我的jquery滑块不工作，但滑块的所有三个图像都显示在我的网站上。我已经检查了linkrel目录路径，并对其进行了几次更改，但它仍然不起作用。希望你们能帮忙 $（'.slider1'）.bxSlider({ 模式：“淡入淡出”，标题：错，是的，传呼机：错， }); $（'.slider2'）.bxSlider({ 传呼机：错，标题：对， maxSlides:3，米斯利德斯：1，滑动宽度：230，幻灯

就在几个小时前，我开始创建我的第一个网站（目前还不完整），并偶然发现了这个问题。我的jquery滑块不工作，但滑块的所有三个图像都显示在我的网站上。我已经检查了linkrel目录路径，并对其进行了几次更改，但它仍然不起作用。希望你们能帮忙

$（'.slider1'）.bxSlider({
模式：“淡入淡出”，
标题：错，
是的，
传呼机：错，
});
$（'.slider2'）.bxSlider({
传呼机：错，
标题：对，
maxSlides:3，
米斯利德斯：1，
滑动宽度：230，
幻灯片摘要：10
});
$（'.slider3'）.bxSlider({
模式：“淡入淡出”，
标题：错，
是的，
传呼机：错，
控件：false，
});
/**这是html（Main.html）：****这是css（styles.css）：**/
@导入url(http://fonts.googleapis.com/css?family=Black+Ops+1:400700）；/*--标题--*/
@导入url(http://fonts.googleapis.com/css?family=Open+Sans:400700）；/*--航行--*/
* {
保证金：0；
边界：0；
填充：0；
}
身体{
背景色：#FEFBEF；
背景色：白色；
}
.clearfix{
明确：两者皆有；
}
#包装纸{
保证金：0自动；
最大宽度：1120px；
背景：#FEFBEF；
溢出：自动；
背景色：黑色；
}
#主割台{
宽度：100%；
边框：1px纯黑；
字体系列：“黑色一号”，无衬线；
背景色：黑色；
颜色：白色；
}
#主割台h1{
浮动：左；
字号：380%；
利润率：-10%02%；
}
#标注{
利润率：50像素20像素0；
}
#标注h2{
文本对齐：右对齐；
颜色：白色；
}
#标注p{
文本对齐：右对齐；
填充：0%；
颜色：灰色；
字体大小：20px；
利润底部：3倍；
}
#导航菜单{
宽度：100%；
身高：10%；
背景色：白色；
}
#导航菜单{
显示：内联块；
利润率：20px 20px 20px 63px；
字体系列：“开放式Sans”，无衬线；
字体大小：20px；
字体大小：粗体；
}
#导航菜单{
文字装饰：无；
颜色：黑色；
}
/*---启动图像滑块--*/
.滑块{
最大宽度：1020px；
盒影：1%2%5%0RGBA（0,0,0,0.07）；
}
.滑块1 img{
宽度：100%；
保证金：0自动；
}
.slider.bx wrapper.bx控制方向a{
大纲：0无；
位置：绝对位置；
文本缩进：-9999px；
最高：40%；
高度：71px；
宽度：40px；
z指数：-1；
过渡：所有0.7秒；
}
.slider.bx包装器：悬停。bx控制方向a{
z指数：5；
}
.slider.bx wrapper.bx prev{
背景：#FCEB86 url（“http://www.w3newbie.com/wp-content/uploads/left-arrow.png）不重复8px 13px；
左：0px；
}
.slider.bx wrapper.bx prev:悬停{
背景：#FCEB86 url（“http://www.w3newbie.com/wp-content/uploads/left-arrow.png）不重复8px 18px；
}
.slider.bx wrapper.bx next{
背景：#FCEB86 url（“http://www.w3newbie.com/wp-content/uploads/right-arrow.png）无重复10px 12px；
右：0px；
}
.slider.bx wrapper.bx下一步：悬停{
背景：#FCEB86 url（“http://www.w3newbie.com/wp-content/uploads/right-  arrow.png“）无重复10px 17px；
}
/*---结束图像滑块--*/
.三分之一{
宽度：28%；
浮动：左；
利润率：2%03%4%；
文本对齐：居中；
边框：1px纯黑；
身高：50%；
背景色：白色；
}
页脚{
字体系列：“开放式Sans”，无衬线；
字体大小：粗体；
文本对齐：居中；
宽度：100%；
身高：6%；
背景色：白色；
溢出：自动；
}
页脚p{
利润率最高：1%；
}
/***这里是另一个css（jquery.bxslider.css）：***/
.bx包装{
最大宽度：1020px；
位置：相对位置；
填充：0；
*缩放：1；
}
.bx包装器img{
最大宽度：1020px；
显示：块；
}
/**主题
===================================*/
.bx包装器.bx视口{
左：0px；
背景：#fff；
/*修复移动页面上的其他元素（在Chrome上）*/
-webkit转换：translatez（0）；
-moz变换：translatez（0）；
-ms变换：translatez（0）；
-o变换：translatez（0）；
变换：translatez（0）；
}
.bx wrapper.bx寻呼机，.bx wrapper.bx控件自动{
位置：绝对位置；
底部：-30px；
最大宽度：1020px；
}
/*装载机*/
.bx包装器.bx加载{
最小高度：50px；
背景：url（“img/bx_loader.gif”）中心不重复；
身高：100%；
最大宽度：1020px；
;
位置：相对位置；
排名：0；
左：0；
z指数：2000；
}
/*传呼机*/
.bx包装器.bx寻呼机{
文本对齐：居中；
字体大小：.85em；
字体系列：Arial；
字体大小：粗体；
颜色：#666；
填充顶部：20px；
}
.bx wrapper.bx pager.bx pager项，.bx wrapper.bx控制自动。bx控制自动项{
显示：内联块；
*缩放：1；
*显示：内联；
}
.bx包装器.bx-pager.bx-default-pager a{
背景:#666；
文本缩进：-9999px；
显示：块；
宽度：10px；
高度：10px；
利润率：0.5px；
大纲：0；
-moz边界半径：5px；
-webkit边界半径：5px；
边界半径：5px；
}
.bx wrapper.bx-pager.bx-default-pager a:悬停，.bx wrapper.bx-pager.bx-default-pager a.激活{
背景：#000；
}
/*方向控制（下一个/上一个）*/
.bx wrapper.bx prev{
左：10px；
背景：url（“img/controls.png”）不重复0-32px；
}
.bx包装器.bx下一个{
右：10px；
背景：url（“img/controls.png”）不重复-43px-32px；
}
.bx wrapper.bx prev:悬停{
背景位置：0；
}
.bx包装器.bx下一步：悬停{
背景位置：-43px 0；
}
.bx包装。bx控制方向a{
位置：相对位置；
最高：50%；
利润上限：-16px；
大纲：0；
宽度：32px；
高度：32px；
文本缩进：-9999px；
z指数：9999；
}
.bx包装。bx控制方向a。已禁用{
显示：无；
}
/*自动控制（启动/停止）*/
.bx包装器.bx控件自动{
文本对齐：居中；
}
.bx包装器.bx控制自动.bx启动{
显示：块；
文本缩进：-9999px；
宽度：10px；
高度：11px；
大纲：0；
背景：url（“img/controls.png”）-86px-11px不重复；
利润率：0.3倍；
}
.bx wrapper.bx控制自动。bx启动：悬停，.bx wrapper.bx控制自动。bx-start.active{
背景位置：-86px 0；
}
.bx包装器.bx控制自动.bx停止{
显示：块；
文本缩进：-9999px；
宽度：9px；
高度：11px；
大纲：0；
背景：url（“img/control
<!DOCTYPE>
<html lang="en">
<head>
    <title>MUSIC STORE</title>
    <link rel="stylesheet" href="jquery.bxslider.css"/>
    <link rel="stylesheet" href="styles.css"/>
    <script src="https://code.jquery.com/jquery-2.2.4.min.js" integrity="sha256-BbhdlvQf/xTY9gja0Dq3HiwQF8LaCRTXxZKRutelT44=" crossorigin="anonymous"></script>
    <script src="js/jquery.bxslider.min.js"></script><!--For Image   Slider-->
    <script type="text/javascript">
    $(function(){
        $('.slider1').bxSlider({
            mode: 'fade',
            captions: false,
            auto: true,
            pager: false,

        });
        $('.slider2').bxSlider({
            pager: false,
            captions: true,
            maxSlides: 3,
            minSlides: 1,
            slideWidth: 230,
            slideMargin: 10
        });
        $('.slider3').bxSlider({
            mode: 'fade',
            captions: false,
            auto: true,
            pager: false,
            controls: false,
        });
    })
    </script>
</head>

<body>
<div id="wrapper">
<header id="main_header">
    <div id="callout">
        <h2>&#9742; 111222333</h2>
        <p>Michigan State Kawasaki Iceland</p>
    </div>
    <h1>MUSIC STORE</h1>
</header>

<div class="clearfix"></div>

<nav id="nav_menu">
    <ul>
        <li><a href="#">HOME</a></li>
        <li><a href="#">INSTRUMENTS</a></li>
        <li><a href="#">AMPLIFIERS</a></li>
        <li><a href="#">ACCESSORIES</a></li>
        <li><a href="#">FEATURED ARTISTS</a></li>
    </ul>
</nav>

<div class="slide-wrap">
    <div class="slider">
        <ul class="slider1">
            <li><img src="img/smiley1.jpg"/></li>
            <li><img src="img/smiley2.jpg"/></li>
            <li><img src="img/sad.jpg"/></li>
        </ul>
    </div>
</div>

<section class="one-third"></section>
<section class="one-third"></section>
<section class="one-third"></section>
<div class="clearfix"></div>
<footer>
    <p>&copy;All Rights Reserved</p>
</footer>
</div>
</body>
</html>