まず第一に:
jQuery (Javascript ライブラリ) を 2 回読み込んでいます。<head>
セクションに 1 回 ( ) <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
、終了</body>
タグの前に 1 回 ( <script type="text/javascript" src="js/jquery.js"></script>
)。次のように、最後のものを削除し、最初のものを最新バージョンの jQuery に更新します。
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.0/jquery.min.js"></script>
2番目:
スクリプトの構造を改善した方がよい場合があります。または、それらすべてを頭にロードするか、終了</body>
タグの前にすべてロードします。こうすることで、予期しない場所にあるスクリプトを調べる必要がなくなります。</body>
ベスト プラクティスは、終了タグの前にすべてのスクリプトを含めることであるとよく言われます。残りのすべてのスクリプトの前にjQuery をロードすることを忘れないでください! あなたの場合、次のようになります。
<footer>...</footer>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.0/jquery.min.js"></script>
<script type="text/javascript" src="js/jquery.carouFredSel.js"></script>
<script type="text/javascript" src="/fancybox/jquery.fancybox.pack.js"></script>
<script type="text/javascript">
$(document).ready(function() {
$("#foo2").carouFredSel({
circular: true,
infinite: false,
auto: false,
prev: {
button: "#foo2_prev",
key: "left"
},
next: {
button: "#foo2_next",
key: "right"
},
pagination: "#foo2_pag"
});
$('.fancybox').fancybox();
});
</script>