我有旋转滑块的问题 - 第一张幻灯片背景图像在初始化之前出现一秒钟，之后显示微调器一秒钟，然后开始显示滑块。我尝试使用page.on加载和jQuery(document).ready，但没有任何改变。
这是我的滑码：
foreach ($homeSliders as $homeSlider)
{
?>
<li
<?php if(isset($homeSlider->effect->title) and $homeSlider->effect->title!=''){
echo 'data-transition="'.$homeSlider->effect->title.'"';
}else{
echo 'data-transition="fade"';
} ?> >
<img src="<?= $homeSlider->getImg($homeSlider->id) ?>" <?=($homeSlider->kenburns == 1 ? $ken : '')?>>
<div class="tp-caption <?=$homeSlider->title_show?> tp-resizeme revo-slider-caps-text uppercase"
data-x="450"
data-y="150"
data-speed="400"
data-start="1000"
data-easing="<?=$homeSlider->title_show?>"
data-splitin="none"
data-splitout="none"
data-elementdelay="0.01"
data-endelementdelay="0.1"
data-endspeed="1000"
data-endeasing="Power4.<?=$homeSlider->title_show?>" style=""><img src="<?= $homeSlider->getImgProduct($homeSlider->id) ?>" alt="<?=$homeSlider->title?>"></div>
<?php if ($homeSlider->title) { ?>
<div class="tp-caption <?= $homeSlider->title_show ?> tp-resizeme revo-slider-emphasis-text nopadding noborder tp-resizing-positions"
data-x="<?=$homeSlider->title_top?>"
data-y="<?=$homeSlider->title_left?>"
data-speed="700"
data-start="1200"
data-easing="<?= $homeSlider->effect->title ?>"
data-splitin="none"
data-splitout="none"
data-elementdelay="0.01"
data-endelementdelay="0.1"
data-endspeed="1000"
data-endeasing="Power4.easeOutCubic" style=" color: <?=$homeSlider->title_color?>; max-width: 730px; width: auto; white-space: normal; line-height: 1.15; font-size: <?=$homeSlider->title_size?>px!important; min-width: 250px;"><?=($homeSlider->title ? $homeSlider->title : '' )?></div>
<?php } ?>
<?php if ($homeSlider->description) { ?>
<div class="tp-caption customin <?= $homeSlider->description_show ?> tp-resizeme revo-slider-desc-text tp-resizing-positions"
data-x="<?=$homeSlider->description_top?>"
data-y="<?=$homeSlider->description_left?>"
data-speed="700"
data-start="1400"
data-customin="x:0;y:150;z:0;rotationZ:0;scaleX:1;scaleY:1;skewX:0;skewY:0;opacity:0;transformPerspective:200;transformOrigin:50% 0%;"
data-easing="<?= $homeSlider->effect->title ?>"
data-splitin="none"
data-splitout="none"
data-elementdelay="0.01"
data-endelementdelay="0.1"
data-endspeed="1000"
data-endeasing="Power4.easeOutCubic" style="text-align: left; color: <?=$homeSlider->description_color?>; max-width: 550px; white-space: normal; font-size: <?=$homeSlider->description_size?>px!important;"><?=($homeSlider->description ? $homeSlider->description : '')?></div>
<?php } ?>
<?php if ($homeSlider->link) { ?>
<div class="tp-caption <?= $homeSlider->button_show ?> tp-resizeme tp-resizing-positions"
data-x="<?=$homeSlider->button_top?>"
data-y="<?=$homeSlider->button_left?>"
data-speed="700"
data-start="1550"
data-easing="<?= $homeSlider->effect->title ?>"
data-splitin="none"
data-splitout="none"
data-elementdelay="0.01"
data-endelementdelay="0.1"
data-endspeed="1000"
data-endeasing="Power4.<?= $homeSlider->effect->title ?>" class="button button-border button-large button-rounded tright nomargin hero-action-btn"><span style=" color: <?=$homeSlider->button_color?>; font-size: <?=$homeSlider->button_size?>px!important; background-color: transparent !important; border: 2px solid #22afeb; padding: 0.5em 2em !important; border-radius: 5px !important; line-height: 1.3em !important;"><a href="<?= $homeSlider->link; ?>" >more</span> <i class="icon-angle-right"></i></a></div>
<?php } ?>
和js：
jQuery(document).ready(function() {
jQuery('.tp-banner').show().revolution(
{
dottedOverlay:"none",
delay:16000,
startwidth:1140,
startheight:600,
hideThumbs:200,
navigationType:"bullet",
navigationArrows:"solo",
navigationStyle:"preview4",
navigation: {
keyboardNavigation:"on",
keyboard_direction: "horizontal",
mouseScrollNavigation:"off",
onHoverStop:"off",
touch:{
touchenabled:"on",
swipe_threshold: 75,
swipe_min_touches: 1,
swipe_direction: "horizontal",
navigationType:"bullet",
drag_block_vertical: false
}
,
arrows: {
style:"zeus",
enable:true,
hide_onmobile:true,
hide_under:600,
hide_onleave:true,
hide_delay:200,
hide_delay_mobile:1200,
left: {
h_align:"left",
v_align:"center",
h_offset:0,
v_offset:0
},
right: {
h_align:"right",
v_align:"center",
h_offset:70,
v_offset:0
}
} ,
bullets: {
enable: true,
container:"slider",
hide_onmobile: false,
style: "ares",
hide_onleave: false,
direction: "horizontal",
h_align: "center",
v_align: "bottom",
h_offset: 0,
v_offset: 30,
space: 3,
rtl:false,
tmp: ''
}
},
touchenabled:"on",
onHoverStop:"on",
swipe_velocity: 0.7,
swipe_min_touches: 1,
swipe_max_touches: 1,
drag_block_vertical: false,
parallax:"mouse",
parallaxBgFreeze:"on",
parallaxLevels:[7,4,3,2,5,4,3,2,1,0],
keyboardNavigation:"off",
navigationHAlign:"center",
navigationVAlign:"bottom",
navigationHOffset:0,
navigationVOffset:0,
soloArrowLeftHalign:"left",
soloArrowLeftValign:"center",
soloArrowLeftHOffset:0,
soloArrowLeftVOffset:0,
soloArrowRightHalign:"right",
soloArrowRightValign:"center",
soloArrowRightHOffset:20,
soloArrowRightVOffset:0,
shadow:0,
fullWidth:"on",
fullScreen:"off",
stopLoop: 'off',
stopAfterLoops: -1,
stopAtSlide: -1,
shuffle:"off",
autoHeight:"off",
forceFullWidth:"off",
hideThumbsOnMobile:"off",
hideNavDelayOnMobile:1500,
hideBulletsOnMobile:"off",
hideArrowsOnMobile:"off",
hideThumbsUnderResolution:0,
hideSliderAtLimit:0,
hideCaptionAtLimit:0,
hideAllCaptionAtLilmit:0,
startWithSlide:0,
fullScreenOffsetContainer: ".header"
});
}); //ready