Skrollr.js не активируется

Я провел последние 3 часа, пытаясь заставить скроллр показать мне что-нибудь! Я пытался вызвать скрипт перед телом, в заголовке, и перепробовал целую кучу руководств, чтобы попытаться заставить его работать, но я не уверен, почему он ВООБЩЕ не работает.

В <head> у меня есть

<script type="text/javascript" src="js/skrollr.min.js"></script>
<script type="text/javascript" src="js/go-skrollr.js"></script>

Хорошо, согласно @melc, я внес некоторые изменения, приведенные ниже являются основными. Все равно не повезло.

(function() {
    $(document).ready(function(){skrollr.init();});
})();

И в моей сводной строке (div прямо под навигацией) у меня есть

<div class="container" data-center="opacity: 1" data-200-top="opacity: 0" data-anchor-target="#summary h3">

Насколько мне известно, это должно заставить содержимое внутри этого контейнера исчезнуть, когда h3 будет на 200 пикселей сверху.

Я пытался назвать это кучей разных способов, но все равно безуспешно!

действующий сайт


javascript twitter-bootstrap skrollr
person ve1jdramas    schedule 16.03.2014    source источник
comment
нет элемента, соответствующего этому селектору #summary h3, но есть для .summary h3   -  person melc    schedule 16.03.2014
comment
@melc сделал это, к сожалению, не сработало, есть другие идеи?   -  person ve1jdramas    schedule 16.03.2014
comment
также необходимо позвонить skrollr.init();, пожалуйста, ознакомьтесь с документацией здесь github.com/Prinzhorn/skrollr #давай-серьезно   -  person melc    schedule 16.03.2014
comment
@melc да, это есть в моем файле go-skrollr.js   -  person ve1jdramas    schedule 16.03.2014
comment
это должно быть вызвано, когда документ был загружен, например, $(document).ready(function(){skrollr.init();});   -  person melc    schedule 16.03.2014
comment
@melc сделал это, не повезло, я обновил сайт, если вы хотите взглянуть.   -  person ve1jdramas    schedule 16.03.2014
comment
Отлично, но также обновите часть summary h3 до .summary h3. Также нужно исправить код в go-skrollr.js см. консоль. Вам придется обернуть анонимную функцию, как она у вас была.   -  person melc    schedule 16.03.2014
comment
@melc хорошо, я попробовал (я почти уверен, что это правильно), но я все еще получаю те же результаты   -  person ve1jdramas    schedule 16.03.2014

Ответы (1)


arrow_upward
2
arrow_downward

На данный момент есть три проблемы, которые, если они будут исправлены, вы увидите Skrollr.js в действии (это было протестировано на сайте, указанном в OP, и это работает).

проблема 1 — data-anchor-target="#summary h3" необходимо изменить на data-anchor-target=".summary h3"

проблема 2. Элемент .hero не должен иметь height:100% , просто закомментируйте его, потому что по какой-то причине он достигает 6k пикселей в высоту после инициализации skrollr, что можно будет проверить позже.

проблема 3. Должна быть выполнена правильная инициализация skrollr. Прямо сейчас в консоли отображается сообщение Uncaught ReferenceError: $ is not defined и речь идет о go-skrollr.js файле. Это связано с тем, что файл библиотеки jQuery должен быть включен перед ссылкой на файл библиотеки skrollr.js.

person melc    schedule 16.03.2014
comment
Вы потрясающие, что полностью сделали свое дело! У вас случайно нет обходного пути для height:100%? Отличная работа чувак!! Определенно узнал пару вещей - person ve1jdramas; 16.03.2014
comment
@Dimitrov спасибо, я рад, что это помогло. Что касается height:100%, я предлагаю удалить его, в конце концов, он не используется в соответствующих элементах hero или jumbotron примеров начальной загрузки, и на самом деле я думаю, что его там нет. - person melc; 16.03.2014
comment
Мне удалось это выяснить, мне просто нужно было изменить параметр forceHeight на false в go-skrollr.js, еще раз спасибо, чувак !!! - person ve1jdramas; 16.03.2014
comment
Это связано с тем, что файл библиотеки jQuery должен быть включен перед ссылкой на файл библиотеки skrollr.js. Нет. Вам вообще не нужен jQuery. - person Prinzhorn; 17.03.2014
comment
@Prinzhorn, если я правильно помню, это требовалось в определенной точке кода, так как OP вызывал $(document).ready без включения jQuery - person melc; 17.03.2014
comment
Конечно, но это не имело отношения к скроллру. - person Prinzhorn; 17.03.2014
comment
@Prinzhorn да, ответ был связан только с указанием и решением проблем сайта на тот момент, чтобы все работало в соответствии с запросом ОП. Однако, пожалуйста, не стесняйтесь дополнять/изменять ответ, чтобы сделать его более точным, или просто предоставить больше информации. Хорошая библиотека, кстати! - person melc; 17.03.2014