noobタイプの質問で申し訳ありません。以下のJSに問題があります。以下の要素は、RoyalSlider: http://dimsemenov.com/plugins/royal-slider/documentation/および Masonry に関連しています。
石積みの呼び出しを JS の下部に配置すると、読み込まれません。上部に配置するとロードされますが、すべてのスライダー呼び出しがノックアウトされます。
スクリプトを分離して個別の呼び出しに配置しても、次のようになります。
jQuery(document).ready(function($) {
...問題は解決しません (一方の呼び出しを他方の上に置くと、もう一方の呼び出しがキャンセルされます)。
これは私の初期化スクリプトです:
jQuery(document).ready(function($) {
var rsi = $('#slideshow').royalSlider({
startSlideId: 1,
transitionSpeed: 300,
slidesSpacing: 0,
loop: true,
autoHeight: false,
arrowsNav: false,
fadeinLoadedSlide: true,
controlNavigationSpacing: 0,
controlNavigation: 'tabs',
imageAlignCenter:true,
loopRewind: false,
numImagesToPreload: 3,
usePreloader: true,
keyboardNavEnabled: false,
sliderDrag: false,
autoScaleSlider: true,
autoScaleSliderWidth: 980,
autoScaleSliderHeight: 653,
allowCSS3: true,
autoPlay: {
enabled: true,
pauseOnHover: true,
delay: 4500,
stopAtAction: false
},
thumbs: {
firstMargin: false,
spacing: 0,
fitInViewport: true
}
}).data('royalSlider');
$('#next').click(function() {
rsi.next();
});
$('#prev').click(function() {
rsi.prev();
});
var slider = $('#wrp_hero');
slider.after(slider.find('.rsNav'));
var rsi2 = $('#slider').royalSlider({
transitionType: 'slide',
arrowsNav: false,
fadeinLoadedSlide: false,
controlNavigationSpacing: 0,
controlNavigation: 'bullets',
loop: false,
loopRewind: false,
keyboardNavEnabled: true,
autoScaleSlider: false,
sliderDrag: false,
autoHeight: true
});
var $container = $('#portfolio');
$container.imagesLoaded( function(){
$container.masonry({
itemSelector : '.box'
});
});
//end doc ready function
});
これは、body タグの上の HTML ドキュメントの下部にあります。s.js は私の初期化スクリプトです (上記のように):
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<script>window.jQuery || document.write('<script src="/assets/j/l/jquery-1.8.3.min.js"><\/script>')</script>
<script src="/assets/j/l/masonry.2.1.07.min.js"></script>
<script src="/assets/j/l/royalslider.min.js"></script>
<script src="/assets/j/p.js"></script>
<script src="/assets/j/s.js"></script>
<script>
var _gaq=[['_setAccount','UA-XXXXX-X'],['_trackPageview']];
(function(d,t){var g=d.createElement(t),s=d.getElementsByTagName(t)[0];
g.src=('https:'==location.protocol?'//ssl':'//www')+'.google-analytics.com/ga.js';
s.parentNode.insertBefore(g,s)}(document,'script'));
</script>
誰かが私を正しい方向に向けることができますか?