2017-03-07 125 views
0

目前我一直在忙着编辑一个WordPress主题很多(布朗克斯阻止&掉落)。我已经使用了这个主题,因为客户希望能够自己调整自己。滑动滑块不能在手机上滚动

Slick Slider,水平图像旋转木马仅在移动设备上显示,不会让用户在图片下方滚动浏览图片,因为它使用水平滑动来浏览图片。

<div id="product-images" class="carousel slick product-images slick-initialized slick-slider" data-navigation="true" data-autoplay="false" rel="gallery" data-columns="1" data-asnavfor="#product-thumbnails"><button type="button" class="slick-nav slick-prev slick-arrow" aria-disabled="false" style="display: block;"></button> 
 
<div aria-live="polite" class="slick-list draggable"><div class="slick-track" style="opacity: 1; width: 5112px;" role="listbox"><figure itemprop="image" class="easyzoom is-ready slick-slide" data-variation="" style="width: 568px; position: relative; left: 0px; top: 0px; z-index: 998; opacity: 0; transition: opacity 1000ms ease;" tabindex="-1" role="option" aria-describedby="slick-slide10" data-slick-index="0" aria-hidden="true"> 
 
<a href="http://#2017/02/#_2076" itemprop="image" class="fresco" data-fresco-group="product_images" data-fresco-group-options="overflow: true" data-fresco-type="image" tabindex="-1"><# src="http://#2017/02/#_2076-640x700" title="#_2076"></a> 
 
</figure><figure itemprop="image" class="easyzoom slick-slide is-ready" data-variation="" style="width: 568px; position: relative; left: -568px; top: 0px; z-index: 998; opacity: 0; transition: opacity 1000ms ease;" tabindex="-1" role="option" aria-describedby="slick-slide11" data-slick-index="1" aria-hidden="true"> 
 
<a href="http://#2017/02/#_2077" itemprop="image" class="fresco" data-fresco-group="product_images" data-fresco-group-options="overflow: true" data-fresco-type="image" tabindex="-1"><# src="http://#2017/02/#_2077-640x700" title="#_2077"></a> 
 
</figure><figure itemprop="image" class="easyzoom slick-slide is-ready slick-current slick-active" data-variation="" style="width: 568px; position: relative; left: -1136px; top: 0px; z-index: 999; opacity: 1;" tabindex="-1" role="option" aria-describedby="slick-slide12" data-slick-index="2" aria-hidden="false"> 
 
<a href="http://#2017/02/#_2078" itemprop="image" class="fresco" data-fresco-group="product_images" data-fresco-group-options="overflow: true" data-fresco-type="image" tabindex="0"><# src="http://#2017/02/#_2078-640x700" title="#_2078"></a> 
 
</figure><figure itemprop="image" class="easyzoom slick-slide is-ready" data-variation="" style="width: 568px; position: relative; left: -1704px; top: 0px; z-index: 998; opacity: 0; transition: opacity 1000ms ease;" tabindex="-1" role="option" aria-describedby="slick-slide13" data-slick-index="3" aria-hidden="true"> 
 
<a href="http://#2017/02/#_2079" itemprop="image" class="fresco" data-fresco-group="product_images" data-fresco-group-options="overflow: true" data-fresco-type="image" tabindex="-1"><# src="http://#2017/02/#_2079-640x700" title="#_2079"></a> 
 
</figure><figure itemprop="image" class="easyzoom slick-slide" data-variation="" style="width: 568px; position: relative; left: -2272px; top: 0px; z-index: 998; opacity: 0;" tabindex="-1" role="option" aria-describedby="slick-slide14" data-slick-index="4" aria-hidden="true"> 
 
<a href="http://#2017/02/#_2080" itemprop="image" class="fresco" data-fresco-group="product_images" data-fresco-group-options="overflow: true" data-fresco-type="image" tabindex="-1"><# src="http://#2017/02/#_2080-640x700" title="#_2080"></a> 
 
</figure><figure itemprop="image" class="easyzoom slick-slide" data-variation="" style="width: 568px; position: relative; left: -2840px; top: 0px; z-index: 998; opacity: 0;" tabindex="-1" role="option" aria-describedby="slick-slide15" data-slick-index="5" aria-hidden="true"> 
 
<a href="http://#2017/02/#_2081" itemprop="image" class="fresco" data-fresco-group="product_images" data-fresco-group-options="overflow: true" data-fresco-type="image" tabindex="-1"><# src="http://#2017/02/#_2081-640x700" title="#_2081"></a> 
 
</figure><figure itemprop="image" class="easyzoom slick-slide" data-variation="" style="width: 568px; position: relative; left: -3408px; top: 0px; z-index: 998; opacity: 0;" tabindex="-1" role="option" aria-describedby="slick-slide16" data-slick-index="6" aria-hidden="true"> 
 
<a href="http://#2017/02/#_2082" itemprop="image" class="fresco" data-fresco-group="product_images" data-fresco-group-options="overflow: true" data-fresco-type="image" tabindex="-1"><# src="http://#2017/02/#_2082-640x700" title="#_2082"></a> 
 
</figure><figure itemprop="image" class="easyzoom slick-slide" data-variation="" style="width: 568px; position: relative; left: -3976px; top: 0px; z-index: 998; opacity: 0;" tabindex="-1" role="option" aria-describedby="slick-slide17" data-slick-index="7" aria-hidden="true"> 
 
<a href="http://#2017/02/#_2083" itemprop="image" class="fresco" data-fresco-group="product_images" data-fresco-group-options="overflow: true" data-fresco-type="image" tabindex="-1"><# src="http://#2017/02/#_2083-640x700" title="#_2083"></a> 
 
</figure><figure itemprop="image" class="easyzoom slick-slide" data-variation="" style="width: 568px; position: relative; left: -4544px; top: 0px; z-index: 998; opacity: 0;" tabindex="-1" role="option" aria-describedby="slick-slide18" data-slick-index="8" aria-hidden="true"> 
 
<a href="http://#2017/02/#_2084" itemprop="image" class="fresco" data-fresco-group="product_images" data-fresco-group-options="overflow: true" data-fresco-type="image" tabindex="-1"><# src="http://#2017/02/#_2084-640x700" title="#_2084"></a> 
 
</figure></div></div><button type="button" class="slick-nav slick-next slick-arrow" style="display: block;" aria-disabled="false"></button></div>

我一直在试图解决这一问题,超过2小时,并没有找到解决的办法呢。

欢迎所有帮助!

回答