• 0
zexerevev

Передача кнопке JS атрибуты

Вопрос

Добрый день народ
У меня есть JS код для веб-картографии который делает отображение на карте двоих шаров и свайп между ними
В html коде вызывается этот JS код такими командами

var ctrl = new ol.control.Swipe();
        map.addControl(ctrl);
       // Set stamen on left
        ctrl.addLayer(osm, true);
      // OSM on right
        ctrl.addLayer(stamen);

Как эти параметры передать на кнопку, что бы onclick включать и выключать данную функцию
Если возможно какие то ссылки на дополнительную информацию по этому, так как придется много делать кнопок под разные функции
Спасибо за понимает с Frontendom еще знаком не близко

Поделиться сообщением


Ссылка на сообщение
Поделиться на других сайтах

Рекомендованные сообщения

Нет ответов на вопрос

Создайте аккаунт или войдите в него для комментирования

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

Создать аккаунт

Зарегистрируйтесь для получения аккаунта. Это просто!

Зарегистрировать аккаунт

Войти

Уже зарегистрированы? Войдите здесь.

Войти сейчас

  • Похожие публикации

    • Автор: AlexanderLebedev
      Имеется слайдер, "//" если удалить эти строки , то все работает. Там collapse от bootstrap, скрыть и показать блок.
      А когда всё на месте, с скрытием, то он показывает так
      Помогите исправить, сложно найти рабочий подобный слайдер. Есть мнение что конфликтуют JS, но как их поставить чтоб всё норм было.
      <!-- Наружная реклама --> <div id="collapse_1" class="collapse" aria-labelledby="heading_1" data-parent="#accordionExample"> // ЭТА УДАЛИТЬ НАДО ЧТОБ РАБОТАЛО <div class="container header"> <div class="row align-items-center"> <div class="card-body card align-items-center bg-lightgrey"> <h5> <img src="http://www.cyberforum.ru/images/header/nar.png" width="105" height="80"> Наружное и внутреннее оформление </h5> </div> </div> <!-- Слайдер --> <div class="swiper-container"> <div class="swiper-wrapper"> <div class="swiper-slide"> <img src="http://www.cyberforum.ru/images/header/logo.png" width="250" height="200"> </div> <div class="swiper-slide"> <img src="http://www.cyberforum.ru/images/header/logo.png" width="250" height="200"> </div> <div class="swiper-slide"> <img src="http://www.cyberforum.ru/images/header/logo.png" width="250" height="200"> </div> <div class="swiper-slide"> <img src="http://www.cyberforum.ru/images/header/logo.png" width="250" height="200"> </div> <div class="swiper-slide"> <img src="http://www.cyberforum.ru/images/header/logo.png" width="250" height="200"> </div> </div> <div class="swiper-button-next"></div> <div class="swiper-button-prev"></div> </div> <!-- Конец слайдера --> </div> </div> // ЭТА УДАЛИТЬ ЧТОБ РАБОТАЛО НАДО <!-- Конец наружной рекламы --> СКРИПТЫ В КОНЦЕ BODY
      <!-- Скрипты --> <script src="https://code.jquery.com/jquery-3.3.1.slim.min.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.3/umd/popper.min.js"></script> <script src="js/slider.js"></script> <script type="text/javascript"> var swiper = new Swiper('.swiper-container', { slidesPerView: 3, spaceBetween: 30, loop: false, loopFillGroupWithBlank: false, navigation: { nextEl: '.swiper-button-next', prevEl: '.swiper-button-prev', } }); </script> <script src="js/bootstrap.js"></script> <!-- Конец скрипты -->  
      После уменьшении или увеличении страницы всё работает как надо. Что за логика ?
    • Автор: Libiros
      Решил использовать .webp для изображений на сайте, а также оптимизировать его через рекомендации google audits.
      Таким образом получилось следующее:
      <img src="image.webp" srcset="image-480.webp 480w, image-768.webp 768w, image-1024.webp 1024w" alt="alt" titile="title"/> Так как webp не поддерживается некоторыми браузерами, было решено использовать решение WebPJS.
      Теперь есть следующая проблема: решение заменяет атрибут src, но не трогает srcset. То есть изображения остаются неизменными и не отображаются.
      Есть следующая идея, но я, полагаю, это будет очень затратно в плане ресурсов, а также неизвестно, как это будет влиять на SEO (может, спасут теги <nofollow>?).
      Распарсить атрибут srcset Создать столько img-элементов, сколько указано изображений в атрибуте Зацепить у каждого измененный атрибут src Составить новый атрибут srcset и заменить его на первом img Остальные img будут помещены под тег nofollow с классом display:none; Пока описывал решение, подумал, что, возможно, это плохое решение в том плане, что тогда у меня возрастет количество запросов на сервер как раз на количество новосозданных img-элементов. Но не уверен, так ли это.
    • Автор: umid99
      Доброго времени суток, возникла проблема при подключении слика , сделал все как по инструкции (Jqwery до slick.js , main.js после slick.js ) но все равно выдает ошибку :
      Uncaught TypeError: Cannot read property 'add' of null
          at c.b.initADA (slick.min.js:17)
          at c.b.init (slick.min.js:17)
          at new c (slick.min.js:17)
          at w.fn.init.a.fn.slick (slick.min.js:18)
          at HTMLDocument.<anonymous> (VM778 main.js:8)
          at l (jquery.min.js:2)
          at c (jquery.min.js:2)
      подскажите решение , уже все перерыл и не у одного меня такое , но решения так и не нашел .
Learn HTML in 2 hours!