我正在使用一个 JQuery 滑块，它在一张幻灯片中显示 4 个相邻的 Wordpress 帖子。这些帖子正在显示用户可以单击以查看所选服务的服务。有 2 张幻灯片展示了这些服务 - 每张幻灯片中有 4 张。每个服务页面都包括顶部的滑块，其下方是服务描述。
http://www.richmindonline.com/virtual/service-options/
问题是我希望首先加载第二张幻灯片 - 仅当用户在第二张幻灯片上选择产品时。
我该如何设置？这是加载滑块的脚本 - 它位于 Wordpress 的插件中。
如果需要，我将上传其他代码。
//$upload_dir = wp_upload_dir();
$output = '<!--Automatic Image Slider w/ CSS & jQuery with some customization-->';
$output .='<script type="text/javascript">
$j = jQuery.noConflict();
$j(document).ready(function() {';
//Set Default State of each portfolio piece
if ($pagination_style != '3' ){
$output .='$j("#rps .paging").show();';
}
$output .='$j("#rps .paging a:first").addClass("active");
$j(".slide").css({"width" : '.$width.'});
$j("#rps .window").css({"width" : '.($width).'});
$j("#rps .window").css({"height" : '.$height.'});
$j("#rps .col").css({"width" : '.(($width/$post_per_slide)-2).'});
$j("#rps .col").css({"height" : '.($height-4).'});
$j("#rps .col p.post-title span").css({"color" : "'.($post_title_color).'"});
$j("#rps .post-date").css({"top" : '.($height-20).'});
$j("#rps .post-date").css({"width" : '.(($width/$post_per_slide)-12).'});';
if (!empty($post_title_bg_color_js)){
$output .='$j("#rps .col p.post-title").css({"background-color" : "'.($post_title_bg_color_js).'"});';
}
$output .='var imageWidth = $j("#rps .window").width();
//var imageSum = $j("#rps .slider div").size();
var imageReelWidth = imageWidth * '.$paging.';
//Adjust the image reel to its new size
$j("#rps .slider").css({"width" : imageReelWidth});
//Paging + Slider Function
rotate = function(){
var triggerID = $active.attr("rel") - 1; //Get number of times to slide
//alert(triggerID);
var sliderPosition = triggerID * imageWidth; //Determines the distance the image reel needs to slide
$j("#rps .paging a").removeClass("active");
$active.addClass("active");
//Slider Animation
$j("#rps .slider").stop(true,false).animate({
left: -sliderPosition
}, 500 );
};
var play;
//Rotation + Timing Event
rotateSwitch = function(){
play = setInterval(function(){ //Set timer - this will repeat itself every 3 seconds
$active = $j("#rps .paging a.active").next();
if ( $active.length === 0) { //If paging reaches the end...
$active = $j("#rps .paging a:first"); //go back to first
}
rotate(); //Trigger the paging and slider function
}, '.$slider_speed.');
};
rotateSwitch(); //Run function on launch
//On Hover
$j("#rps .slider a").hover(function() {
clearInterval(play); //Stop the rotation
}, function() {
rotateSwitch(); //Resume rotation
});
//On Click
$j("#rps .paging a").click(function() {
$active = $j(this); //Activate the clicked paging
//Reset Timer
clearInterval(play); //Stop the rotation
rotate(); //Trigger rotation immediately
rotateSwitch(); // Resume rotation
return false; //Prevent browser jump to link anchor
});
});
</script>';