2015-01-13 2 views
1

Я строй параллакса сайта, и я хочу, чтобы отключить параллакс прокрутки эффект на небольших видовых (я хочу, чтобы отключить параллакс скрипта для видовых ниже 460PX)Условно нагрузки JavaScript с помощью Modernizr

я сделал некоторый простой запасной вариант css исправляет использование Modernizr, но не может понять, как настроить этот периметр, а затем загружать в соответствующие файлы js.

Я использую scrollr.js для эффекта параллакса.

http://prinzhorn.github.io/skrollr/

Спасибо за помощь !!!

ответ

2

Чтобы быть честным, было бы выгоднее использовать фактический загрузчик JavaScript, тем более, что Modernizr - это всего лишь функция обнаружения HTML5 и CSS3, и я считаю, что у меня нет встроенной поддержки JavaScript. Когда это было необходимо, оно обрабатывалось теперь устаревшим YepNope (см. Ниже).

Некоторые потенциальные сценарии для вашей проблемы являются Require.js, LABjs или YepNope[Устаревшее].

Есть несколько других возможностей, таких как Head.js, но это, в основном, полный набор инструментов, который имеет функции Modernizr, jQuery и нескольких других библиотек, свернутых в один. Однако для того, что вы хотите сделать, это может быть слишком громоздким. Существует также LazyLoad, который не поддерживается, но также должен быть в состоянии предоставить вам необходимую функциональность.

Дополнительная литература:

Quora Answer

ScriptJunkie Article (Same Author as Quora Answer)

+0

Большое спасибо @Brandon, какой полезный ответ. Я просмотрел документацию для scrollr, и у них было решение из коробки для моей проблемы. Однако я боролся с условной загрузкой JavaScript в прошлом, и эти предложения выглядят потрясающе, я сделаю некоторые из этих дальнейших чтений, которые вы предложили :) –

+0

Рад это услышать @RyanCampbell :) Надеюсь, что это поможет вам найти много в будущее! –

2

В случае, если вам не нужны специальные вещи, как заказанного исполнения или обратного вызова, как только загружается и выполняется сценарий, то вполне легко:

function loadJS(u){var r=document.getElementsByTagName("script")[0],s = document.createElement("script");s.src = u;r.parentNode.insertBefore(s,r);} 

Использование:

if(!Modernizr.feature){ 
    loadJS('path/to/script.js'); 
} 

В случае, если вы используете JQuery вы можете сделать это +, то у вас также есть обратный вызов:

if(!Modernizr.feature){ 
    $.ajax({ 
     url: 'path/to/script.js', 
     dataType: 'script', 
     cache: true, 
     global: false, 
     crossDomain: true //good for debugging 
    }); 
} 

Таким образом, в 90% случаев не потребуется специальный загрузочный сценарий.

Смежные вопросы