1

製品ページに HTML コンテンツを表示するライトボックスを追加する必要があるテンプレートの編集に取り組んでいます。正確には、「カートに追加」ボタンの代わりに、インライン ライトボックス コンテンツの上にポップするボタンが表示されます。

私が調べたライトボックスの代替案はすべて、CDN を使用して jQuery を継承する必要があります。このような： <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>

私が使用しているテンプレートは、head.phtml およびその他のページで一連のカスタム スクリプトを使用しています。お気に入り：

<script type="text/javascript" src="<?php echo $this->getSkinUrl('js/ver_menu.js');?>"></script>
<script type="text/javascript" src="<?php echo $this->getSkinUrl('js/custommenu.js');?>"></script>

したがって、この行を head.phtml または製品ページに追加すると、マイ トップ メニューのドロップダウンが停止し、製品情報タブが機能しなくなり、すべての情報が製品ページに表示されます (それぞれのタブの下に表示されるのではなく)。 .

jQueryスクリプト間のこの干渉を回避して、ライトボックス（製品ページ-view.phtml）を機能させ、メニューと情報タブに影響を与えないようにする方法はありますか.

しばらくこれに苦労しており、テーマの作成者も助けようとしません.

上に投稿した jQuery Line の配置を試してみましたが、うまくいきませんでした。Magento のコア jQuery スクリプトを使用して、ライトボックスを機能させる方法...

また、ライトボックス効果にカラーボックスを使用しています。(http://www.jacklmoore.com/colorbox)

大したことはできませんが、この問題を解決するのを手伝ってくれる人なら誰でも夕食とビールを提供できます。本当に頼りになります…

4

3 に答える 3

1

私はこの方法でこれを行います /templatefiolder/page/html/head.phtml にこのコードを追加しました:

 <!-- adding jQuery -->
<script type="text/javascript" src="http://linktoJquery/jquery.tools.min.js"></script>

<script type="text/javascript">
//<![CDATA[
     var $j = jQuery.noConflict();
//]]>
</script>

プロトタイプと競合するため、この $j を追加しました。この場合、常に次のように jQuerythings を実行する必要があります。

<script>
// execute your scripts when DOM is ready. this is a good habit
$j(function() {     

    $j(".scrollable").scrollable();

});
</script>
于 2012-08-20T14:10:42.303 に答える
0

Magento サイトで CDN 経由で jQuery を使用しないでください。それは問題を引き起こすでしょう。代わりに、サーバーでホストしてください。スクリプトを開き、次を追加します。

jQuery.noConflict();

ファイルの最後に。jquery.min.no-conflict.js の行に沿って名前を変更して、将来 noConflict() モードで実行されていることが誰にとっても明らかになるようにし、他の jQuery ベースのスクリプトよりも前にロードされるようにします。

noConflict() モードであるため、$ (Magento 1.x で使用される JavaScript フレームワークである Prototype で使用される) ではなく、インスタンス化子として「jQuery」を使用して jQuery スクリプトを作成する必要があります。

于 2012-08-20T10:18:21.827 に答える
0

あなたが試したライトボックスは、jQuery ライブラリを必要とする jQuery プラグインです。ライブラリをホストするか、他の誰かにホストさせるか (CDN など) は関係ありません。ページですでに jQuery のバージョンを実行している場合は、おそらく何も追加する必要はありません。

あなたのページが $ エイリアスを利用している他のスクリプトを使用している場合は、pspahn が言ったように noConflict を使用する必要があります。その後、ローカル スコープを作成してそこに割り当てないと、'$' を jQuery のエイリアスとして使用できなくなります。例：

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<script>jQuery.noConflict();</script>
<script src='jquery.colorbox-min.js'></script>
<script>
  jQuery(document).ready(function(){
    var $ = jQuery; // create an alias for typing convenience
    $('a.example').colorbox();
  });
</script>
于 2012-08-20T13:20:25.847 に答える