JQueryズームが機能しない[終了]

StackOverflow https://stackoverflow.com//questions/12714038

質問

JQueryを実装しようとしています ズーム 私のJoomla主導のWebサイトのカタログ画像にあります。この問題をうまく動作させることができないので、誰かこの問題の解決を手伝ってくれませんか?

これらのスクリプトをヘッドに追加しました。

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8/jquery.min.js" type="text/javascript"></script>
<script src="http://www.myurl.mk/templates/beez_20/javascript/jquery.zoom.js"></script>

これが与えるエラーです:

Uncaught TypeError: Object #<HTMLDocument> has no method 'ready'
(anonymous function)

ここに私のサイトの例へのリンクがあります

これが私のコードです:

<script>
        $(document).ready(function(){
            $('#ex1').zoom({url: '<?php echo $this->item->imageXLarge; ?>'});
        });
    </script>
      <div class="itemImageBlock" style="float:none;">
          <span class="itemImage" id="ex1">
                <img src="<?php echo $this->item->image; ?>" alt="<?php if(!empty($this->item->image_caption)) echo K2HelperUtilities::cleanHtml($this->item->image_caption); else echo K2HelperUtilities::cleanHtml($this->item->title); ?>" style="width:<?php echo $this->item->imageWidth; ?>px; height:auto;" />
          </span>
役に立ちましたか？

解決

あなたのページを見たところ、依存ファイルの後にjQueryファイルをロードしていることがわかりました。コンソールにエラーが多数発生します。1つ目はjQueryが定義されていないことです。jQuery ファイルを他のすべてのスクリプト ファイルの前に移動します。

jQuery を上部に移動すると、サイトは正常に表示されます。ご要望に応じてスナップショットを添付しました。enter image description here

他のヒント

サンプルページでは、jquery.js の前に ks2.js をインポートしています。

これは、あなたの後の最初の項目である必要があります <head> 鬼ごっこ：

<script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8/jquery-ui.min.js" type="text/javascript"></script>
ライセンス： CC-BY-SA と 帰属
所属していません StackOverflow
scroll top