Управление узлами DOM - PullRequest
       5

Управление узлами DOM

0 голосов
/ 17 октября 2018

Я немного схожу с ума.У меня есть слайдер, который просматривает некоторые картинки.Это вывод HTML:

<div class="slider slider-nav slick-initialized slick-slider">
    <div class="slick-list draggable">
         <div class="slick-track" style="opacity: 1; width: 730px; transform: translate3d(0px, 0px, 0px);">
             <div class="images"/>
             <div class="images"/>
             <div class="images"/>
         </div>
    </div>
</div>

это то, что заполняет скользящую дорожку:

 <div class="slider slider-nav">
      <s:iterator value="asset.photos">
           <div class="slider-nav__slide">
                <img src="<s:property value="webPath" />" onerror="this.src='<s:url value="/images/new/default-placeholder.png" />'">
            </div>
      </s:iterator>
 </div>

, так что struts2 просматривает изображения актива, и скользящая навигация отображает их.Я не уверен, как работает скользкая навигация.

У меня небольшая ошибка, когда скользкая дорожка (как видно в выводе HTML) получает свойство transform: translate3d(0px, 0px, 0px);.При изменении размера он портится, и я решил, что мне нужно присвоить ему свойство transform: translate3d(0px, 0px, 0px) !important;, если в активе меньше 5 или меньше картинок

, поэтому я попробовал так много вещей ... jQueryселекторы vanilla js, children (), find (), item () ... ничего не работает.Я не могу нацелиться на класс Slick-Track.

$(document).ready(function() {
    var photos = <s:property value="asset.photos.size"/>;
//  var div = document.getElementsByClassName('slider-nav');
//  var slick = div.item(0);
    photos <= 5 ? $('.slider-nav .slick-track').css("transform", "translate3d(0,0,0) !important") : null; 
}) 

, поэтому интересная часть заключается в том, что console.log($('.slider-nav') дает мне это:

> w.fn.init [div.slider.slider-nav, prevObject: w.fn.init(1)]
    0: div.slider.slider-nav.slick-initialized.slick-slider
    length: 1
    prevObject: w.fn.init [document]
    __proto__: Object(0)

, и когда я открываю его, я вижуchildNode, я вижу slick-list, я также вижу дочерний список slick-list, который slick-track, но когда я console.log($('.slider-nav > .slick-list > .slick-track')), он дает мне это:

> w.fn.init [prevObject: w.fn.init(1)]
    length: 0
    prevObject: w.fn.init [document]
    __proto__: Object(0)

Как будто это нене вижу этого ... Я пытался нацелить его через children (), через find (), через бог знает что ... Я как шаг от использования Mutation.observer ... с тех пор, как я регистрирую ползунок-nav, я вижу детей, не имеет смысла, что у слик-трека не было достаточно времени, чтобы загрузить ... помочь?пожалуйста .. это ранит меня как личность

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...