javascript - 如何使用 wordpress 网站的引导轮播删除移动版本中的第一张幻灯片

Question

我已经创建了 wordpress 网站并实现了 bootstrap 轮播，这没有问题。

我想在移动版本中使用 bootstrap carousel 隐藏第一张幻灯片。如果我使用 jquery first() 和 eq() 选择器，整个 slider 是空白的，其他 slider 不工作。 我已经添加了脚本，但它不起作用，请帮助我。

引用站点:http://floretmedia.net/temp/sieger-parking-v2/

if ($(document).width() < 995) {      	
           $(".carousel-inner .carousel-item").find(".sieger-category").remove(); 
       
        }

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="banner-wrapper">
    <div id="bootstrap-touch-slider" class="carousel bs-slider fade  control-round indicators-line" data-ride="carousel" data-pause="hover" data-interval="4000">
       <div class="downarrow"><a href="#welcome"><img src="http://floretmedia.net/temp/sieger-parking-v2/wp-content/themes/seiger/theme/img/downarrow.png" class="img-fluid"></a> 
       </div>
      <!-- Wrapper For Slides -->
     <div class="carousel-inner" role="listbox">
       <div class="carousel-item">
             <!-- Slide Text Layer -->
          <div class="slide-text slide_style_left">
             <h1 data-animation="animated zoomIn">
			  <div id="sieger-banner"><strong>Parking System </strong>Swift the car to the flexible parking lot</div>
                  <div class="sieger-category">
                 <div class="row">
                  <a class="sieger-item" href="products/stack-parking-systems/"></p>
            <div class="sieger-img">
             <img src="http://192.168.1.156/sieger-parking/wp-content/themes/seiger/theme/img/stack-park.jpg" alt="stack parking" />
           </div>
          <div class="siger-txt">
            <p>STACK PARKING SYSTEM</p>
       </div>
       </a> <!-- sieger-item -->
      <a class="sieger-item" href="products/puzzle-parking-system/">
       <div class="sieger-img">
          <img src="http://192.168.1.156/sieger-parking/wp-content/themes/seiger/theme/img/puzzle-park.jpg" alt="puzzle parking" />
        </div>
      <div class="siger-txt">
        <p>PUZZLE PARKING SYSTEM</p>
       </div>
      </a> <!-- sieger-item -->
   </div>
  <!-- row -->
  <div class="row">
  	<a class="sieger-item" href="products/pit-puzzle-parking-system/"></p>
      <div class="sieger-img">
          <img src="http://192.168.1.156/sieger-parking/wp-content/themes/seiger/theme/img/pit-puzzle-parking.jpg" alt="Pit puzzle parking" />
        </div>
        <div class="siger-txt">
            <p>PIT PUZZLE PARKING SYSTEM</p> 
        </div>
     </a> <!-- sieger-item -->
     <a class="sieger-item" href="products/fully-automated-parking-system/"></p>
        <div class="sieger-img">
           <img src="http://192.168.1.156/sieger-parking/wp-content/themes/seiger/theme/img/fully-automated-parking.jpg" alt="fully automated parking" />
        </div>
     <div class="siger-txt">
        <p>FULLY AUTOMATED PARKING SYSTEM</p>
      </div>
     </a> <!-- sieger-item -->
  </div>
</div>
</h1> 
</div> <!-- Slide Background -->
      <img src="http://192.168.1.156/sieger-parking/wp-content/uploads/2018/10/banner-1.jpg" alt=""  class="img-fluid"/>
      <!--<div class="bs-slider-overlay"></div>-->
    </div>
      <div class="carousel-item">
        <!-- Slide Text Layer -->
         <div class="slide-text slide_style_left">
             <h1 data-animation="animated zoomIn" class="animated zoomIn">
		        <p><strong>PUZZLE<br> Parking System </strong>Easy check in and check out the cars</p>
            </h1> 
        </div>
      <!-- Slide Background --> 
      <img src="http://floretmedia.net/temp/sieger-parking-v2/wp-content/uploads/2018/07/banner2.jpg" alt="" class="img-fluid">
      <!--<div class="bs-slider-overlay"></div>-->
      
    </div>
  </div>
  
 <a class="left carousel-control" href="#bootstrap-touch-slider" role="button" data-slide="prev"> <span class="fa fa-angle-left" aria-hidden="true"></span> <span class="sr-only">Previous</span> </a> <a class="right carousel-control" href="#bootstrap-touch-slider" role="button" data-slide="next"> <span class="fa fa-angle-right" aria-hidden="true"></span> <span class="sr-only">Next</span> </a>
 
 
  </div>

Answer 1

您可能需要使用js移除，否则将无法正常工作