微信公众号搜"智元新知"关注
微信扫一扫可直接关注哦!

如何让滑块指示器正常工作?

如何解决如何让滑块指示器正常工作?

所以我一直在通过 shopify 对网站进行自定义编码,但我遇到了移动滑块的问题 - 指标正在显示,但由于某种原因它们根本不起作用。我希望这可能是脚本的问题(这是我在这里很新的内容)没有将活动类(产品推荐__slide-indicator--active)添加到相关指标。

到目前为止,这个社区的学习非常棒,所以希望你们能在这里再次救我,如果有人有任何建议来解决这个问题,那就太棒了。 :)

HTML

<section>
<div>
<div class="features-section">
<div type="roller">
<div class="features-title-margin" type="roller">
  <h3 class="features-title-class {{ section.settings.features_heading_style }}">{{ 
section.settings.features_heading }}</h3>
</div>

<div class="features-slider-container-mobile product-recommendations">      
    <ul type="roller" direction="ltr" class="features-slider-class-mobile product- 
recommendations__slider">
      
{% for block in section.blocks %}
{% case block.type %}
{% when 'model-features' %}
      
            <li class="product-recommendations__slide" type="roller"  data-recommendations-slide 
data-product-recommendation-index="{{ forloop.index }}">
                    <div class="features-tab-class-mobile">
                        <figure class="features-figure-class-mobile">
                                <picture class="features-picture-class-mobile">
                                  <img src="{{ block.settings.features_image | img_url: '1000x1000' }}"
                                       alt="">
                                </picture>
                          
                                <figcaption class="features-caption-class">
                                    <p class="features-caption-title {{ section.settings.features_title_style }}">{{ block.settings.features_sub_heading }}</p>
                                    <span class="features-caption-text {{ section.settings.features_text_style }}">{{ block.settings.features_text }}</span>
                                </figcaption>
                        </figure>
                    </div>
            </li>
{% endcase %}
{% endfor %}
            
    </ul>
</div>
  
  <div class="product-recommendations__indicators-wrapper" aria-hidden="true" data-recommendations-indicators>
        {%- for block in section.blocks -%}
          <span class="product-recommendations__slide-indicator featuredindi" id="Featuredindi" data-recommendations-indicator data-product-recommendation-indicator-index="{{ forloop.index }}"></span>
        {%- endfor -%}
      </div>

</div>
</div>
</div>

</section>

版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。