ID #1069

Mobifyカルーセルを実装してうまく動作していたのですが、私がスタジオに戻って来たとき、ホームページのためのテンプレートが見つかりませんでした。 今度は再構築したらカルーセルが動作しません。基本テンプレートにカルーセルCSSとJavaScriptが含め、ホームにカルーセルhtmlを入れたのですが、イメージが横長に只管伸びるだけでスワイプ機能が動作しません。どうやったら直りますか?

>あなたのページのカルーセルモジュールはJavaScriptコールによって起動する必要があると思われます。ホームテンプレートの一番下に次のスクリプトが入っていることを確かめてください。

 

<script> /* protect global scope */ (function(){ var controls = $('#firstCarousel .m-carousel-controls'); $('#firstCarousel .m-item').each(function(index){ /* create a pip for each slide */ controls.append('<a href="/content/7/70/ja/mobify%E3%82%AB%E3%83%AB%E3%83%BC%E3%82%BB%E3%83%AB%E3%82%92%E5%AE%9F%E8%A3%85%E3%81%97%E3%81%A6%E3%81%86%E3%81%BE%E3%81%8F%E5%8B%95%E4%BD%9C%E3%81%97%E3%81%A6%E3%81%84%E3%81%9F%E3%81%AE%E3%81%A7%E3%81%99%E3%81%8C%E3%80%81%E7%A7%81%E3%81%8C%E3%82%B9%E3%82%BF%E3%82%B8%E3%82%AA%E3%81%AB%E6%88%BB%E3%81%A3%E3%81%A6%E6%9D%A5%E3%81%9F%E3%81%A8%E3%81%8D%E3%80%81%E3%83%9B%E3%83%BC%E3%83%A0%E3%83%9A%E3%83%BC%E3%82%B8%E3%81%AE%E3%81%9F%E3%82%81%E3%81%AE%E3%83%86%E3%83%B3%E3%83%97%E3%83%AC%E3%83%BC%E3%83%88%E3%81%8C%E8%A6%8B%E3%81%A4%E3%81%8B%E3%82%8A%E3%81%BE%E3%81%9B%E3%82%93%E3%81%A7%E3%81%97%E3%81%9F%E3%80%82-%E4%BB%8A%E5%BA%A6%E3%81%AF%E5%86%8D%E6%A7%8B%E7%AF%89%E3%81%97%E3%81%9F%E3%82%89%E3%82%AB%E3%83%AB%E3%83%BC%E3%82%BB%E3%83%AB%E3%81%8C%E5%8B%95%E4%BD%9C%E3%81%97%E3%81%BE%E3%81%9B%E3%82%93%E3%80%82%E5%9F%BA%E6%9C%AC%E3%83%86%E3%83%B3%E3%83%97%E3%83%AC%E3%83%BC%E3%83%88%E3%81%AB%E3%82%AB%E3%83%AB%E3%83%BC%E3%82%BB%E3%83%ABcss%E3%81%A8javascript%E3%81%8C%E5%90%AB%E3%82%81%E3%80%81%E3%83%9B%E3%83%BC%E3%83%A0%E3%81%AB%E3%82%AB%E3%83%AB%E3%83%BC%E3%82%BB%E3%83%ABhtml%E3%82%92%E5%85%A5%E3%82%8C%E3%81%9F%E3%81%AE%E3%81%A7%E3%81%99%E3%81%8C%E3%80%81%E3%82%A4%E3%83%A1%E3%83%BC%E3%82%B8%E3%81%8C%E6%A8%AA%E9%95%B7%E3%81%AB%E5%8F%AA%E7%AE%A1%E4%BC%B8%E3%81%B3%E3%82%8B%E3%81%A0%E3%81%91%E3%81%A7%E3%82%B9%E3%83%AF%E3%82%A4%E3%83%97%E6%A9%9F%E8%83%BD%E3%81%8C%E5%8B%95%E4%BD%9C%E3%81%97%E3%81%BE%E3%81%9B%E3%82%93%E3%80%82%E3%81%A9%E3%81%86%E3%82%84%E3%81%A3%E3%81%9F%E3%82%89%E7%9B%B4%E3%82%8A%E3%81%BE%E3%81%99%E3%81%8B%EF%BC%9F.html" data-slide="' + (index+1) + '">' + (index+1) + '</a>'); }); /* mark the first pip as active */ $('#firstCarousel .m-item:nth-of-type(1)').addClass('m-active'); /* activate the carousel */ $('.m-carousel').carousel(); })(); </script>

 

あとこのコードがベーステンプレートに入っていることも確かめてください。

 

<script type="text/javascript"> window.$ = Mobify.$; </script>

タグ: -

関連エントリー:

この FAQ にコメントする