2016-01-27 2 views
0

Я использую Wordpress Theme, который работает как одностраничное приложение, но я не вижу никаких угловых библиотек в любом месте.jQuery пользовательский скроллер контента, исчезающий, когда я посещаю другие страницы

Мне удалось создать пользовательский шаблон страницы Wordpress для главной страницы, которая не была включена в тему. На этой странице у меня есть строка с тремя прокручиваемыми столбцами с использованием jQuery custom content scroller для замены полосы прокрутки браузера по умолчанию.

Когда вы заходите на сайт, он будет выглядеть так, как должен. Но когда вы переходите на другую страницу, а затем возвращаетесь на главную страницу, пользовательская полоса прокрутки перестает отображаться и возвращается обратно к стандартной.

Я не вижу ошибок в консоли.

Вы можете увидеть живую версию страницы здесь: http://utopic.vision/demo

Я инициализировать пользовательский скроллбар, добавив класс mCustomScrollbar раздел, как это.

<div class="row" style="height: 100% !important; margin-left: 0 !important; margin-right: 0 !important;"> 

    <div class="col-md-5 no-padder" style="overflow-y: hidden !important; height: 100% !important;"> 
     <section class="vbox animated fadeInUp"> 
      <section class="scrollable hover mCustomScrollbar"> 
       some data 
      </section> 
    </div> 

    <div class="col-md-4 no-padder" style="overflow-y: hidden !important; overflow: hidden !important; height: 100%;"> 
     <section class="vbox"> 
      <section class="scrollable hover mCustomScrollbar"> 
       some data 
      </section> 
    </div> 

    <div class="col-md-3 no-padder" style="overflow-y: hidden !important; height: 100%;"> 
     <section class="vbox"> 
      <section class="scrollable hover mCustomScrollbar"> 
       some data 
      </section> 
    </div> 

</div> 

А внутри functions.php это как тема добавляет CSS и JS библиотеки в заголовок. Я добавил пользовательские библиотеки прокрутки вручную в конце.

function musik_scripts() { 
    wp_enqueue_style('musik-style', get_stylesheet_uri()); 

    wp_enqueue_script('musik-navigation', get_template_directory_uri() . '/js/navigation.js', array('jquery'), '', true); 

    wp_enqueue_script('musik-skip-link-focus-fix', get_template_directory_uri() . '/js/skip-link-focus-fix.js', array('jquery'), '', true); 

    if (is_singular() && comments_open() && get_option('thread_comments')) { 
     wp_enqueue_script('comment-reply'); 
    } 

    wp_enqueue_style('animate', get_template_directory_uri().'/assets/css/animate.css'); 
    wp_enqueue_style('font-awesome', get_template_directory_uri().'/assets/css/font-awesome.min.css'); 
    wp_enqueue_style('simple-line-icons', get_template_directory_uri().'/assets/css/simple-line-icons.css'); 
    wp_enqueue_style('bootstrap', get_template_directory_uri().'/assets/css/bootstrap.css'); 
    wp_enqueue_style('app', get_template_directory_uri().'/assets/css/app.css'); 
    wp_enqueue_style('font', get_template_directory_uri().'/assets/css/font.css'); 
    **wp_enqueue_style('scrollbar', get_template_directory_uri().'/assets/js/scrollbar/jquery.mCustomScrollbar.min.css');** 


    wp_enqueue_script('bootstrap', get_template_directory_uri() . '/assets/js/bootstrap.js', array('jquery'), '', true); 
    wp_enqueue_script('app', get_template_directory_uri() . '/assets/js/app.js', array('jquery'), '', true); 
    wp_enqueue_style('jplayer', get_template_directory_uri().'/assets/js/jPlayer/jplayer.flat.css'); 
    wp_enqueue_script('jplayer', get_template_directory_uri() . '/assets/js/jPlayer/jquery.jplayer.min.js', array('jquery'), '', true); 
    wp_enqueue_script('playlist', get_template_directory_uri() . '/assets/js/jPlayer/add-on/jplayer.playlist.min.js', array('jquery'), '', true); 
    wp_enqueue_script('storage', get_template_directory_uri() . '/assets/js/jquery.storageapi.min.js', array('jquery'), '', true); 
    wp_enqueue_script('player', get_template_directory_uri() . '/assets/js/player.js', array('jquery'), '', true); 
    wp_enqueue_script('playlists', get_template_directory_uri() . '/assets/js/playlist.js', array('jquery'), '', true); 
    **wp_enqueue_script('scrollbar', get_template_directory_uri() . '/assets/js/scrollbar/jquery.mCustomScrollbar.concat.min.js', array('jquery'), '', true);** 
    wp_localize_script('player', 'ajax_object', array('ajaxurl' => admin_url('admin-ajax.php')), '', true); 

    wp_enqueue_style('wp-mediaelement'); 
    wp_enqueue_script('wp-mediaelement', false, array('jquery'), false, true); 

    wp_enqueue_script('tile', get_template_directory_uri() . '/assets/js/masonry/tiles.min.js', array('jquery'), '', true); 
    wp_enqueue_script('tile-init', get_template_directory_uri() . '/assets/js/tile.js', array('jquery'), '', true); 

    if(get_theme_mod('hide-loading') == 0){ 
     wp_enqueue_script('nprogress', get_template_directory_uri() . '/assets/js/nprogress/nprogress.js', array('jquery'), '', true); 
     wp_enqueue_style('nprogress', get_template_directory_uri().'/assets/js/nprogress/nprogress.css'); 
     wp_enqueue_script('pjax', get_template_directory_uri() . '/assets/js/jquery.pjax.js', array('jquery'), '', true); 
     wp_enqueue_script('pjaxinit', get_template_directory_uri() . '/assets/js/ajax.js', array('jquery'), '', true); 
    } 
} 
add_action('wp_enqueue_scripts', 'musik_scripts'); 

ответ

0

Я установил его.

После небольшого рытья я понял, что тема использует плагин pAjax для достижения функциональности с одной страницей (например, угловой).

Так что все, что мне нужно было сделать, - это перезагрузить пользовательскую полосу прокрутки с помощью jQuery (вместо HTML) в ajax.js, который является компонентом pAjax.

Просто добавьте это в ajax.js, который отвечает за выполнение запросов ajax.

$(".scrollable .hover").mCustomScrollbar(); 
Смежные вопросы