Настройка одновременно: фокус на карусели и смена предмета - PullRequest
Новая
       22

Настройка одновременно: фокус на карусели и смена предмета

0 голосов
/ 05 января 2019

Я использую виджет карусели фреймворка Hugo, но это может быть очень простой вопрос HTML. Я хочу, чтобы гиперссылка в тексте делала две вещи: изменила элемент виджета карусели и сфокусировалась на нем.

Мой текущий код выглядит следующим образом: 

<a href="#hero_carousel" data-target="#hero_carousel" data-slide-to="2">linked phrase</a>

Теперь успешно меняет предмет карусели на нужный. Но это не фокус на карусели.

С другой стороны, я могу сосредоточиться на этой карусели, но, конечно, пункт карусели не изменился: 

<a href="#hero_carousel">linked phrase</a>

Так как я могу объединить оба? Я также попытался включить атрибуты data-target и data-slide в li-тег, который окружает a-тег, который действительно вызывает изменение элемента, но также игнорирует href.

Я также безуспешно пытался использовать span-тег внутри a-tag.

Может быть, мне нужно что-то сделать с JavaScript? Я пытался, но не очень хорошо знаю javascript.

Заранее спасибо!

1 Ответ

0 голосов
/ 06 января 2019

ОК, в конце концов, я решил проблему следующим образом. Я создал javascript, который прокручивается до карусели. Я на самом деле также создал кнопку для подключения этого JavaScript. И внутри таблицы я создал ячейки, которые содержат атрибуты data-slide-to. 

<th data-target="#hero_carousel" data-slide-to="4">
<button type="button" style="width:100%" onclick="document.getElementById('screen_focus').scrollIntoView({
  behavior: 'smooth'});">Daten sammeln</button></th>
...