SMint模板和Slider不能一起工作

时间:2015-01-03 11:02:48

标签: javascript jquery html

所以我一直试图将SMINT模板和BJQS滑块组合在一起。我的目标是将滑块放在“SMINT Demo Page / n Something Something Something”的右侧,例如SMINT的样子如下:http://www.outyear.co.uk/smint/demo/

要使滑块工作,我需要将这些行放入smint模板:

jQuery(document).ready(function($) {
$('#banner-fade').bjqs({
    'height' : 320,
    'width' : 620,
    'responsive' : true
});
});

我想将上面提到的jQuery代码放到MY创建的slider.js文件中,但是滑块甚至没有显示,它只是不起作用。我究竟做错了什么?据我所知$(document).ready();应该只写一次。也有人可以解释我应该如何确定脚本文件的优先级:头部bjqs脚本或smint中的第一个是什么?

到目前为止,SMINT模板看起来像这样:

<!DOCTYPE html>
<html>
<head>


<script src="http://code.jquery.com/jquery-latest.min.js"></script>
<script src="bjqs.min.js"></script>
<link type="text/css" rel="Stylesheet" href="bjqs.css" />

 // ^^^^ necessary lines for BJQS

<script src="slider.js"></script>

// ^^^ my created .js file that I want to have the BJQS code in.

<link href="css/demo.css" rel="stylesheet" type="text/css">
<script type="text/javascript" src="js/jquery.min.js"></script>

<script src="js/jquery.smint.js" type="text/javascript" ></script>

<script type="text/javascript">


    $(document).ready( function() {
        $('.subMenu').smint({
            'scrollSpeed' : 1000
        });
        // I tried putting here $('#banner-fade').bjqs({ bla bla
        });
</script>
</head>
<body>
<div class="wrap ">
<div class="section sTop">
        <div class="inner">
            <h1 class="title">SMINT Demo Page</h1>
            <h2 class="subtitle">Something something something</h2>
    </div>
    <div id="my-slideshow">
        <ul class="bjqs">
            <li img src="img/banner01.jpg"> </li>
            <li img src="img/banner02.jpg"> </li>
            <li img src="img/banner03.jpg"> </li>
        </ul>
    </div>
</div>

我希望我的问题很明确。感谢您的任何帮助!

0 个答案:

没有答案