Javascript 基本jQuery滑块根本不显示_Javascript_Jquery

Javascript 基本jQuery滑块根本不显示

javascript jquery

Javascript 基本jQuery滑块根本不显示,javascript,jquery,Javascript,Jquery,我想在一个页面上实现滑块，但我想我会先尝试一下这个例子。根本没有显示任何内容。我搜索了一下表格，做了一些小改动，但还是没有用。代码如下： <!doctype html> <html> <head> <meta charset="utf-8"> <title>Untitled Document</title> <script src="http://ajax.googleapis.com/ajax/libs/jquer

我想在一个页面上实现滑块，但我想我会先尝试一下这个例子。根本没有显示任何内容。我搜索了一下表格，做了一些小改动，但还是没有用。代码如下：

<!doctype html>
<html>

<head>
<meta charset="utf-8">
<title>Untitled Document</title>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js">     </script>
<script src="jquerySlider/js/bjqs-1.3.js"></script>
<link type="text/css" rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/themes/base/jquery-ui.css">
<link type="text/css" rel="Stylesheet" href="jquerySlider/bjqs.css" />

<style TYPE="text/css">
<!--
#my-slideshow {
background-color:#A3CF2E;
}
-->
</style>
</head>

<body>
<div id="my-slideshow">
    <ul class="bjqs">
        <li>first time for me</li>
        <li>second round of the game</li>
    </ul>
</div>
<script>
jQuery(document).ready(function($) {
$('#banner-fade').bjqs({
    'height' : 320,
    'width' : 620,
    'responsive' : true,
    'animtype' : 'fade', // accepts 'fade' or 'slide'
    'animduration' : 450, 
    'animspeed' : 4000, 
    'automatic' : true, 


        'showcontrols' : true, 
    'centercontrols' : true, 
    'nexttext' : 'Next', 
    'prevtext' : 'Prev', 
    'showmarkers' : true, 
    'centermarkers' : true, 


        'keyboardnav' : true, 
    'hoverpause' : true,


        'usecaptions' : true, 
    'randomstart' : true, 
});
});
</script>
</body>
</html>


无标题文件

我第一次
第二轮比赛

jQuery（文档）.ready（函数（$）{
$（“#旗帜褪色”）.bjqs({
‘高度’：320，
“宽度”：620，
“响应”：是的，
'animtype'：'fade'，//接受'fade'或'slide'
“持续时间”：450，
“速度”：4000，
“自动”：正确，
“showcontrols”：正确，
“centercontrols”：true，
“下一步”：“下一步”，
“prevtext”：“Prev”，
"showmarks":对,，
“中心标记”：正确，
“键盘导航”：正确，
“悬停”：对，
“usecaptions”：正确，
“随机开始”：正确，
});
});

你的div id应该是banner，而不是我的幻灯片。或者将

$（'#旗帜褪色'）.bjqs（{

更改为

$（'#我的幻灯片”）.bjqs（{

“height”和“width”以及所有其他内容周围都不应该有“height”和“width”。只有fade、next和prev应该有“height”和“width”。添加“basicly comments”可以去掉这些行

<!doctype html>
<html>

<head>
<meta charset="utf-8">
<title>Untitled Document</title>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js">            </script>
<script src="jquerySlider/js/bjqs-1.3.js"></script>
<link type="text/css" rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/themes/base/jquery-ui.css">
<link type="text/css" rel="Stylesheet" href="jquerySlider/bjqs.css" />

<style TYPE="text/css">
<!--
#my-slideshow {
background-color:#A3CF2E;
}
-->
</style>
</head>

<body>
<div id="my-slideshow">
    <ul class="bjqs">
        <li>first time for me</li>
        <li>second round of the game</li>
    </ul>
</div>
<script>
jQuery(document).ready(function($) {
$('#my-slideshow').bjqs({
    height : 320,
    width : 620,
    responsive : true,
    animtype : 'fade', // accepts 'fade' or 'slide'
    animduration : 450, 
    animspeed : 4000, 
    automatic : true, 


    showcontrols : true, 
    centercontrols : true, 
    nexttext : 'Next', 
    prevtext : 'Prev', 
    showmarkers : true, 
    centermarkers : true, 


    keyboardnav : true, 
    hoverpause : true,


    usecaptions : true, 
    randomstart : true, 
});
});
</script>
</body>
</html>


无标题文件

我第一次
第二轮比赛

jQuery（文档）.ready（函数（$）{
$（“#我的幻灯片”）.bjqs({
身高：320，
宽度：620，
回答：是的，
animtype:'fade'，//接受'fade'或'slide'
持续时间：450，
速度：4000，
自动：对，
showcontrols：对，
centercontrols：对，
下一步：“下一步”，
prevtext:“Prev”，
是的，
是的，
键盘导航：对，
悬停：是的，
用法说明：正确，
开始：是的，
});
});

控制台中有错误吗？插件文件路径正确吗？可能与I get

Uncaught TypeError:Object[对象对象]重复我试用时没有方法“bjqs”

。您可能缺少jQuery插件吗？编辑：看起来您缺少bjqs-1.3.js。请尝试再次检查文件路径是否正确。@Zhihao。当然，您会遇到错误，因为它是对本地文件的引用！