Всем привет, мне надо отключить плагин, при определенном разрешении, например при 768 пикселей и ниже. То есть у меня вот так подключен плагин <скрипт type="text/javascript" src="libs/lightbox2/dist/js/lightbox.min.js"> в index.html. Видел здесь 2 похожие темы, но ответы по ним не помогли, да и там советовали только скрипты как отключать и подключать, это я знаю. Здесь вопрос как путь к плагину что-ли удалять, в общем, чтобы плагин вообще не подключался при разрешении 768 и ниже. Заранее спасибо!!!
3 ответа
Вы можете создавать script элемент с помощью JavaScript:
if ($(window).width() > 768) {
var script = document.createElement('script');
script.src = 'libs/lightbox2/dist/js/lightbox.min.js';
document.head.appendChild(script);
}
Можно без использования jQuery (не будет работать в старых IE):
if (window.innerWidth > 768) {
var script = document.createElement('script');
script.src = 'libs/lightbox2/dist/js/lightbox.min.js';
document.head.appendChild(script);
}
-
К сожалению ваш вариант у меня не работает, но я решил проблему еще вчера следующим образом– LiEm4 июн 2017 в 12:02
-
<script type="text/javascript"> { if (screen.width > 768) document.write ('<script type="text/javascript" src="libs/lightbox2/dist/js/lightbox.min.js" ></sc' + 'ript>'); } </script>– LiEm4 июн 2017 в 12:02
-
Только проблема в том, что при ресайзе надо обновлять страницу, чтобы принялись изменения, а это не очень хорошо. ну что поделать если нет варианта по-лучше...– LiEm4 июн 2017 в 12:03
-
@LiEm Вы хотели "чтобы плагин вообще не подключался", нельзя отменить подключение плагина.– Save144 июн 2017 в 16:20
Не может быть сделано ... Тег скрипта обрабатывается как только DOM визуализатор делает это, так что получить ссылку на него после того, как обработался ничего не даст. Вместо этого можно удалять event и переназначать функции.
-
Я буду рад любому решению, главное чтобы выше 768px плагин работал а ниже данного разрешения не работал– LiEm3 июн 2017 в 15:25
Вы должны будете использовать JS для этого. В зависимости от того, что Lightbox библиотеки вы используете вы, возможно, потребуется повторно инициализировать его после того, как свойство Lightbox отн добавляется обратно.
var lightboxOnResize = function lightboxOnResize() { if ($(window).width() < 960) { $('a[rel="lightbox"]') .removeProp('rel') .addClass('lightboxRemoved'); } else { $('a.lightboxRemoved').prop('rel', 'lightbox'); }
}
$(document).ready(lightboxOnResize); $(window).resize(lightboxOnResize);