※ ChatGPTを利用し、要約された質問です（原文：jQueryプラグイン、サーバー上だと動かない。）
jQueryプラグインのprettyphotoがサーバー上で動かない
このQ&Aのポイント
jQueryプラグインのprettyphotoを実装したWEBサイトが、ローカル環境では問題なく動いているが、サーバーにアップするとエラーが発生し動作しない。
Can't find variable:$というエラーメッセージが表示されるため、プラグインの記述を修正してもjQueryというエラーメッセージが表示される。
サイトのテンプレートを改変しているため、HTML後半部分にも複数のjavascriptの記述があり、これらを一つずつ削除してもprettyphotoは動作しない。原因を探す方法を教えてほしい。
こんにちは。
このたび制作しているWEBサイトにjQueryプラグインのprettyphotoを実装したいのですが、ローカルの環境では問題なく動いてくれるのですが、サーバーにアップしたとたんにエラーがでてしまいまったく動いてくれません。
<head>内のスクリプトの記述は
<script src="js/libs/modernizr-2.0.6.min.js"></script>
<script src="js/prettyphoto/js/jquery-1.6.1.min.js"></script>
<script src="js/prettyPhoto/js/jquery.prettyPhoto.js"></script>
<script type="text/javascript" charset="utf-8">
$(document).ready(function(){
$("a[rel^='prettyPhoto']").prettyPhoto({theme:'light_rounded'});
});
</script>
という感じです。
※そのほか直前にprettyphotoのCSSは読み込んでおります
サーバーにアップしたページのソースをみてみるとCan't find variable:$というメッセージがでていたのでプラグインの記述を
(function($){ //
$(document).ready(function(){
$("a[rel^='prettyPhoto']").prettyPhoto({theme:'light_rounded'});
});
}(jQuery)); //
にしてみてもCan't find variable:jQueryというメッセージがでてきてしまいます。
こちらもともとテンプレートであったサイトを改変しているものなので、このほかHTML後半部分にもいろいろjavascriptの記述があります。以下となります。
<script>window.jQuery || document.write('<script src="js/libs/jquery-1.7.1.min.js"><\/script>')</script>
<script type="text/javascript" src="js/jquery.easing.1.3.js"></script>
<script type="text/javascript" src="js/jquery.easing.compatibility.js"></script>
<script type="text/javascript" src="js/jquery.validate.pack.js"></script>
<script type="text/javascript" src="js/cycle/jquery.cycle.all.latest.js"></script>
<script type="text/javascript" src="js/jquery.tweet.js"></script>
<!-- super fish js include -->
<script type="text/javascript" src="js/superfish/js/superfish.js"></script>
<script type="text/javascript" src="js/superfish/js/hoverIntent.js"></script>
<script defer src="js/plugins.js"></script>
<script defer src="js/script.js"></script>
レイアウトが崩れないようひとつひとつとりはずしてみたのですがprettyphotoは動いてくれませんでした。
またパスが間違っていないかも何度もチェックはしたつもりです。
本当に困っているのですが、このような時どうやって原因を探していけばよいのか、何かアドバイスを
いただけたらと思い投稿させていただきました。
当方、WEB制作初心者のため、見当はずれなことを訊いていましたらご容赦ください。
どうぞよろしくおねがいします。
お礼
ご回答ありがとうございます。さきほど自己解決しました。 ご指摘のとおりjqueryが読み込まれていなかったようです。 jqueryを格納しているフォルダのスペルが”prettyphoto”と"prettyPhoto"と混同してしまい、サーバー上のソースをいろいろ書き換えているうちに起きた凡ミスでした。 ひとつ学習しました！どうもありがとうございました！