スマホメニューが開かない

Question

いつもお世話になっております。

楽天goldとYahoo!トリプルで作っていた特集ページのスマホメニューが開かなくなっていました。
それぞれjsの方でエラーが出ていたのですが、ページを作成してからcssやjsを変更してないので、
なぜエラーが起こっているのか分かりません。

ご教示お願い致します。

エラーが起きているページ
楽天
https://www.rakuten.ne.jp/gold/tokeiten/feature/monitor-citizen/xc-monitor.html
Yahoo!
https://shopping.geocities.jp/tokeiten/kikaku/monitor-citizen/xc-monitor.html

Accepted Answer

ECマスターズの田中です。

お試しいただき、ありがとうございました。
私にて、入替えが反映された状態で変化がないことを確認いたしました。

再び構造を調べたところ、
楽天のpjax.jsが
$(function(){
で始まっているのに対し、Yahoo!では
Barba.Dispatcher.on("newPageReady", function(){
で始まっていることがわかりました。

pjax.jsの中にはBarba.jsの大本の仕組みを動作させる処理が
記載されているのですが、
Yahoo!の場合、その処理がBarba.js動作後の処理の中に記載されているため、
大本の仕組み自体が動作しないようになっておりました。

Yahoo!のpjax.jsの１行目を
$(function(){
にご変更いただき、動作するようになるか、ご確認いただきますようお願いします。

Answer

ECマスターズの田中です。

スマホメニューにつきまして、
確認の上、改めてご返信いたしますので
今しばらくお待ちいただきますようお願いします。

Answer

ECマスターズの田中です。

楽天市場では、Barbaを読み込む

の前に

が記載されており、
script.jsの中でまだ定義されていないBarbaを利用しようとして
エラーが発生しておりますので、
まずはこの２行の順番を入替えていただきますようお願いします。

Yahoo!ショッピングの状況を確認したところ、
script.jsの中で記載されている
Barba.Dispatcher.on("newPageReady", function(){
が動作していないことがわかりました。

Barba.js自体が動作していないのか、
xc-monitor.htmlの中で記載されている

Barba.Dispatcher.on("newPageReady", function(){
new WOW().init();
});

が、script.js内の処理を上書きしてしまっているのかを
確認するために、

上記記述を楽天と同様
new WOW().init();
の１行だけにご変更の上、動作をご確認いただきますようお願いします。

Answer

ご回答の方ありがとうございます！

楽天は教えていただきましたscriptの順番を入れ替えましたら、
メニューが出てくるようになりました。

Yahoo!の方は記述を楽天と同じように
new WOW().init();
に変更しましたが、メニューは出てきませんでした。
エラーを確認してみましたが、
SmoothScroll.jsの
    event.preventDefault();
に×マークがついておりました。

またご教示の程していただければ幸いです。

Answer

ECマターズの田中です。

楽天にて、無事解決して何よりです。

Yahoo!につきまして、お試しいただきありがとうございました。
改めて、
Barba.Dispatcher.on("newPageReady", function(){
new WOW().init();
});
の記述に戻していただきますようお願いします。

また、Yahoo!のページの構造を改めて確認したところ、

にて、ページ読み込みと共にBarbaの動作開始を指定しているところ、その後の

にて、新しいjQueryを読み込むことによって、
jQueryオブジェクトが上書きされ、無効化されているように見受けられました。


を、他のscriptタグよりも前、

上記タグの前に移動していただき、動作をご確認いただきますようお願いします。

Answer

ご回答の方ありがとうございます。

scriptを入れ替えてみましたが、特に変化はありませんでした。
キャッシュの可能性もありますでしょうか？

Answer

ご回答ありがとうございます！

pjax.jsの一行目を変更しましたら、メニューが動くようになりました。
適切なアドバイス、本当にありがとうございます。