Divi WordPress的主題 - 更改幻燈片轉換速度

Question

我在我爲客戶建立的網站上使用Divi，並在主頁上有一個預加載器設置，用於在網站顯示前加載頁面和圖像。唯一的問題是，Divi全寬滑塊中的第一張幻燈片在頁面加載的同時開始，所以當預加載器完成並淡出屏幕時，第一張幻燈片會更快轉換到第二張幻燈片。

我問過ElegantThemes，他們說我的請求超出了支持範圍。我甚至不知道從哪裏開始調整，因此只有第一張幻燈片的時間比其他幻燈片長。

所以，我想我的問題是，如何更改Divi Fullwidth Slider上第一張幻燈片的轉換時間？

這裏的鏈接:: http://mfinangaphoto.wpengine.com

我想我已經找到了確定的代碼，如果幻燈片自動動畫速度，下/可溼性粉劑內容/主題/迪維/包括/建設者/ main- modules.php：

$fullwidth = 'et_pb_fullwidth_slider' === $function_name ? 'on' : 'off'; 

    $class = ''; 
    $class .= 'off' === $fullwidth ? ' et_pb_slider_fullwidth_off' : ''; 
    $class .= 'off' === $show_arrows ? ' et_pb_slider_no_arrows' : ''; 
    $class .= 'off' === $show_pagination ? ' et_pb_slider_no_pagination' : ''; 
    $class .= 'on' === $parallax ? ' et_pb_slider_parallax' : ''; 
    $class .= 'on' === $auto ? ' et_slider_auto et_slider_speed_' . esc_attr($auto_speed) : ''; 
    $class .= 'on' === $auto_ignore_hover ? ' et_slider_auto_ignore_hover' : ''; 
    $class .= 'on' === $remove_inner_shadow ? ' et_pb_slider_no_shadow' : ''; 
    $class .= 'on' === $show_image_video_mobile ? ' et_pb_slider_show_image' : ''; 

    $output = sprintf(
     '<div%4$s class="et_pb_module et_pb_slider%1$s%3$s%5$s"> 
      <div class="et_pb_slides"> 
       %2$s 
      </div> <!-- .et_pb_slides --> 
     </div> <!-- .et_pb_slider --> 
     ', 
     $class, 
     $content, 
     ($et_pb_slider_has_video ? ' et_pb_preload' : ''), 
     ('' !== $module_id ? sprintf(' id="%1$s"', esc_attr($module_id)) : ''), 
     ('' !== $module_class ? sprintf(' %1$s', esc_attr($module_class)) : '') 
    ); 

return $output; 

我該如何調整它，使其允許第一張幻燈片具有與其他幻燈片不同的幻燈片速度？

Answer 1

不確定您使用的是哪個版本的Divi，但在我的版本（Divi 1.9.1）中有一個名爲js/custom.js的文件，它負責運行幻燈片放映。

圍繞線119 - 125，你會發現這個功能：時間，每個幻燈片顯示

function et_slider_auto_rotate(){ 
    if (settings.slideshow && et_slides_number > 1 && ! $et_slider.hasClass('et_slider_hovered')) { 
     et_slider_timer = setTimeout(function() { 
      $et_slider.et_slider_move_to('next'); 
     }, settings.slideshow_speed); 
    } 
} 

的settings.slideshow_speed可變控制量。你可以像下面那樣調整這個文件。請注意，以下是即時僞代碼，未經測試。這是評論，所以你可以跟着。我的例子將只處理你的旋轉木馬的非常第一張幻燈片。因此，當第一張幻燈片重複播放時，除非您再進行一些黑客入侵，否則您將被鎖定在與其他幻燈片相同的時間控件上。

// somewhere inside the same function block closure in js/custom.js 

// first, create some arbitrary variable to manage whether or not we've started 
var hasCarouselStarted 

// create our own custom function to get the interval between slides 
function getMyInterval() { 
    // our carousel has already started, so, return the default interval 
    if (hasCarouselStarted) { 
    return settings.slideshow_speed 
    } 
    // we got here, so this is the first time the carousel is start, 
    // mark the flag as true so we won't get here anymore 
    hasCarouselStarted = true 
    // return time in milliseconds for the first slide. 
    return 1 * 60 * 1000 // 1 min * 60 seconds & 1000 milliseconds 
} 

function et_slider_auto_rotate(){ 
    if (settings.slideshow && et_slides_number > 1 && ! $et_slider.hasClass('et_slider_hovered')) { 
    et_slider_timer = setTimeout(function() { 
     $et_slider.et_slider_move_to('next'); 
    // use our function to determine slide speed instead of the original settings.slideshow_speed 
    }, getMyInterval()); 
    } 
} 

希望有幫助。