@distorsion

Uikit switcher, не показывает вложенный слайдер, почему?

Суть вопроса такова - с помощью Uikit, а точнее его компонента switcher я создал парочку табов. Внутрь одного из них поставил родной UIKIT слайдер. Проблема вот чем - при загрузке страницы, если вкладка, где находится слайдер является активно, то слайдер работает нормально. Однако, если вкладка не активна, то при переходе на нее, слайдер не показывается, хотя в исходном коде он есть. В чем может быть проблема? Прикрепляю исходный код.
<div id="slideeer" class="uk-container uk-container-center">
                    <h3>Slider and Slideshow</h3>
                    <div class="uk-container uk-container-center uk-width-3-4" >
                        <div id="slideshow" data-uk-slideshow="">
                            <div class="uk-slidenav-position">
                                <ul class="uk-slideshow">
                                    <li><img src="http://getuikit.com/docs/images/placeholder_800x400_1.jpg"></li>
                                    <li><img src="http://getuikit.com/docs/images/placeholder_800x400_2.jpg"></li>
                                    <li><img src="http://getuikit.com/docs/images/placeholder_800x400_3.jpg"></li>
                                    <li><img src="http://getuikit.com/docs/images/placeholder_800x400_1.jpg"></li>
                                    <li><img src="http://getuikit.com/docs/images/placeholder_800x400_2.jpg"></li>
                                    <li><img src="http://getuikit.com/docs/images/placeholder_800x400_3.jpg"></li>
                                </ul>
                                <ul>
                                    <a href="" class="uk-slidenav uk-slidenav-contrast uk-slidenav-previous" data-uk-slideshow-item="previous"></a>
                                    <a href="" class="uk-slidenav uk-slidenav-contrast uk-slidenav-next" data-uk-slideshow-item="next"></a>
                                </ul>
                            </div>
                            <div id="slider" class="uk-slidenav-position" data-uk-slider="{center:true}">
                                <div class="uk-slider-container">
                                    <ul class="uk-slider uk-grid-width-medium-1-4">
                                        <li data-uk-slideshow-item="0">
                                            <img src="http://getuikit.com/docs/images/placeholder_800x400_1.jpg">
                                        </li>
                                        <li data-uk-slideshow-item="1">
                                            <img src="http://getuikit.com/docs/images/placeholder_800x400_2.jpg">
                                        </li>
                                        <li data-uk-slideshow-item="2">
                                            <img src="http://getuikit.com/docs/images/placeholder_800x400_3.jpg">
                                        </li>
                                    </ul>
                                    <a href="" class="uk-slidenav uk-slidenav-contrast uk-slidenav-previous" data-uk-slider-item="previous"></a>
                                    <a href="" class="uk-slidenav uk-slidenav-contrast uk-slidenav-next" data-uk-slider-item="next"></a>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
  • Вопрос задан
  • 513 просмотров
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Похожие вопросы