jQuery滑块没有'；无法使用已保存的图像_Jquery_Html_Css

jQuery滑块没有'；无法使用已保存的图像

jquery html css

jQuery滑块没有'；无法使用已保存的图像,jquery,html,css,Jquery,Html,Css,我正在尝试将jQuery滑块添加到我的网站，但由于某些原因，它不会显示保存在计算机上的图像，而只显示网站上的图像代码如下。如您所见，列表中的第一个元素是文件中的图像，该文件位于/Users/Dom/Desktop/NewWebsite/images/jam.jpg <!DOCTYPE HTML> <html> <head> <title>UnSlider</title> <style>

我正在尝试将jQuery滑块添加到我的网站，但由于某些原因，它不会显示保存在计算机上的图像，而只显示网站上的图像

代码如下。如您所见，列表中的第一个元素是文件中的图像，该文件位于/Users/Dom/Desktop/NewWebsite/images/jam.jpg

<!DOCTYPE HTML>
<html>
    <head>
        <title>UnSlider</title>
        <style>
            body, html {
                padding:0px;
                margin: 0px;
            }
            .banner { 
                position: relative; 
                width: 100% !important; 
                overflow: auto; 
                padding: 0px;
                margin: 0px;
            }
            .banner ul {
                padding: 0px;
                margin: 0px;
            }
            .banner li { 
                list-style: none; 
                padding: 0px;
                margin: 0px;
            }
            .banner ul li { 
                float:left;
                padding: 0px;
                margin: 0px;
                min-height: 350px;
                -webkit-background-size: 100% auto;
                -moz-background-size: 100% auto;
                -o-background-size: 100% auto;
                -ms-background-size: 100% auto;
                background-size: 100% auto;
                background-position-y: -75px;
                box-shadow: inset 0 -3px 6px rgba(0,0,0,.1);
            }
        </style>
    </head>
    <body>
        <div class="banner">
            <ul>
                <li style="background-image: url("../images/jam.jpg");"></li>
                <li style="background-image: url('http://placehold.it/1400x400');"></li>
                <li style="background-image: url('http://placehold.it/1400x400');"></li>
                <li style="background-image: url('http://placehold.it/1400x400');"></li>
            </ul>
        </div>

        <script src="http://code.jquery.com/jquery-latest.min.js"></script>
        <script src="http://unslider.com/unslider.min.js"></script>

        <script>
            $(document).ready(function(){
                $('.banner').unslider({
                    speed: 500,               //  The speed to animate each slide (in milliseconds)
                    delay: 5000,              //  The delay between slide animations (in milliseconds)
                    keys: true,               //  Enable keyboard (left, right) arrow shortcuts
                    dots: false,               //  Display dot navigation
                    fluid: false              //  Support responsive design. May break non-responsive designs
                });
            });
        </script>
    </body>
</html>


不滑动
正文，html{
填充：0px；
边际：0px；
}
.banner{
位置：相对位置；
宽度：100%！重要；
溢出：自动；
填充：0px；
边际：0px；
}
班纳保险公司{
填充：0px；
边际：0px；
}
班纳利先生{
列表样式：无；
填充：0px；
边际：0px；
}
班纳先生{
浮动：左；
填充：0px；
边际：0px；
最小高度：350px；
-webkit背景尺寸：100%自动；
-moz背景尺寸：100%自动；
-o-背景尺寸：100%自动；
-ms背景尺寸：100%自动；
背景尺寸：100%自动；
背景位置y:-75px；
盒影：插入0-3px6pxRGBA（0,0,0,1）；
}






$（文档）.ready（函数（）{
$（'.banner'）.unslider({
速度：500，//为每张幻灯片设置动画的速度（毫秒）
延迟：5000，//幻灯片动画之间的延迟（毫秒）
按键：true，//启用键盘（左、右）箭头快捷键
dots:false，//显示点导航
流体：错误//支持响应性设计。可能会破坏非响应性设计
});
});

谢谢

也许你想共享这个html文件所在文件夹的路径和图像所在的文件夹，这将对你有所帮助

假设您的html文件位于：/Users/Dom/Desktop/NewWebsite中，要访问图像，请执行以下操作：

或在您的示例中，

2点（..）表示返回一个文件夹，而图像位于同一文件夹中。您还可以执行以下操作：

1点（.）表示有一个名为images的文件夹，在同一个文件夹中，进入该文件夹并为我找到一张名为jam的图片。jpg希望这有助于好运–

谢谢，我编辑了我的原始帖子。该文件位于/Users/Dom/Desktop/NewWebsite/images/jam.jpg。如果有关系的话，那是苹果电脑。谢谢！我把它改成了‘images/jam.jpg’，它可以正常工作