2015-07-16 2 views
1

Я пытаюсь вызвать два события CSS при переключении разделов в приложении fullPage.js. Пожалуйста, смотрите скрипку, где я в настоящее время здесь: http://jsfiddle.net/pingo_/67oe1jvn/2/fullPage.js onLeave триггеры событий

Я хотел бы сделать следующие две вещи:

  • изменить класс значков фа-стека для атрибутов при наведении курсора мыши, когда я оставьте страницу (в настоящее время цвет меняется только на клик/зависание, но я бы хотел, чтобы он менялся, если использование просто прокручивается)
  • Изменить цвет узлов навигации на #ffffff, когда цвет фона - # 004e7b (в настоящее время не видны узлы в разделах 2 и 4)

Каков наилучший способ достичь этого? У меня есть код в нижней части прорыва javascript, который пытается вызвать сообщение, когда я оставляю первый раздел. Это на самом деле портит прокрутки полностью и пропускает весь путь до последнего раздела:

var fromSection1 = false; 
$('#fullpage').fullpage({  
    onLeave: function(index, direction){ 
    var leavingSection = $(this); 
    //after leaving section 2 
    if(index == 1 && direction =='down'){ 
     alert("Going to section 2!"); 
    }else{ 
     fromSection1 = false; 
    } 
    } 
}); 

И я сделал бы что-то подобное, чтобы вызвать изменение класса для к.-а.-нав секций? Я ничего не писал в css, bc Я не уверен, что это должно быть сделано там, в javascript или в обоих. Раньше я не вводил атрибуты класса, и у меня много проблем с этими двумя. Пожалуйста, посоветуйте лучший подход и посмотрите, сможете ли вы помочь. Благодаря !!

+0

работает от этого: https://github.com/alvarotrigo/fullPage.js/issues/256 – pingo

ответ

1

Вы работаете в ответ предоставляется один год назад ... Сейчас onLeave событие имеет 3 параметра Intead двух, как вы можете увидеть here in the documentation.

OnLeave: функция (индекс, NEXTINDEX, направление) {

Что касается ваших вопросов, для изменения класса вам нужен javascript. Но, возможно, это не то, что вам нужно.

Отъезд this video.

Помните fullPage.js добавляет класс active к активному участку, и в body элемент добавляет класс fp-viewing-xxx где ххх является anchor название текущего раздела или его индекс, если не указаны якоря.

Таким образом, вы можете играть с CSS:

#demo{ 
    color: red; 
} 

/* applied only on the section with the anchor `firstpage` */  
body.fp-viewing-firstpage #demo{ 
    color: blue; 
} 
Смежные вопросы