bx滑块最后一张幻灯片移动了一点然后控件消失了

时间：2017-03-23 10:44:30

标签： jquery html css bxslider

我对bx-slider有一个奇怪的问题。滑块工作正常但是当它根据我的滑块配置到达最后一张幻灯片时，控件必须消失，但是在点击和滑动一点之后它就会消失。 这是我的代码

＆＃13;
＆＃13; 
jQuery('#slider-container-118-119').bxSlider({
  minSlides: 1,
  maxSlides: 3,
  slideWidth: 330,
  infiniteLoop: false,
  autoStart: false,
  pager:false,
  slideMargin: 3,
  useCSS:false,
  hideControlOnEnd:true,
});
＆＃13; 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/bxslider/4.2.12/jquery.bxslider.js"></script>
<link href="https://cdnjs.cloudflare.com/ajax/libs/bxslider/4.2.12/jquery.bxslider.css" rel="stylesheet"/>

<div id="cat-name" style=" margin-top:48px" class="tab-content-container">
<div id="slider-container-118-119">

<div class=" slider-boxes" style=" border-left:1px dotted #ccc">
<div class="" style="min-height:280px; padding:5px;">  
<div class="city_destinations" style="text-align:center;">
<div class="map_are"><h5><a style="text-decoration:none;" href="http://easytours/tours/11-day-first-visit.htm">11 Day First Visit</a></h5></div><br>
<div><i>Depart from US - Delhi - Varanasi - Khajuraho - Agra - Jaipur</i></div><br>
<div style="position: absolute;bottom:0px; left:81px;">
<span class="map" style="width:72px; text-decoration:underline; font-size:12px; padding-bottom:3px;" id="zoom" onclick="large_image_show(612)"><strong>View Map</strong></span>
<div style="padding-top:15px;">Duration - 11 Days</div>
<div class="result_pvt" id="result_g_612" style="font-family:Verdana, Geneva, sans-serif;font-size:12px;  color:#800; line-height:25px; overflow:hidden; margin-top:10px;" align="center"><div>     
	     
      
     
	     	<a href="http://easytours/tours/11-day-first-visit.htm">	<div onmouseout="this.style.borderColor='#ccc'" onmouseover="this.style.borderColor='#800'" id="result_g_349" style="width: 172px; border: 1px solid #ccc; float: none;  padding-top: 6px; padding-bottom: 6px; font-weight: bold; background-color: #f5f5f5;" align="center">
		<strong>View Detailed Itinerary</strong>
	</div></a>
		

  </div></div>
</div>
</div>
<script>	jQuery.ajax({
    		type: "GET",
    		url: "ajax_comp_links.php",
			beforeSend:function()
				{
					 jQuery('#result_g_612').html('<img src="images/ajax-loader.gif">');
				},
				data:'tour_type=c&fid='+612+'&tour_name='+'11_Day_First_Visit'+'&l='+'1,2,3'
				}).done(function( msg ){jQuery("#result_g_612").html(msg)});
</script>
</div>
</div>

<div class=" slider-boxes" style=" border-left:1px dotted #ccc">
<div class="" style="min-height:280px; padding:5px;">  
<div class="city_destinations" style="text-align:center;">
<div class="map_are"><h5><a style="text-decoration:none;" href="http://easytours/tours/15-day-north-india-visit.htm">15 Day North India Visit</a></h5></div><br>
<div><i>Depart from US - Delhi - Varanasi - Khajuraho - Agra - Ranthambore - Jaipur - Udaipur</i></div><br>
<div style="position: absolute;bottom:0px; left:81px;">
<span class="map" style="width:72px; text-decoration:underline; font-size:12px; padding-bottom:3px;" id="zoom" onclick="large_image_show(613)"><strong>View Map</strong></span>
<div style="padding-top:15px;">Duration - 15 Days</div>
<div class="result_pvt" id="result_g_613" style="font-family:Verdana, Geneva, sans-serif;font-size:12px;  color:#800; line-height:25px; overflow:hidden; margin-top:10px;" align="center"><div>     
	     
      
     
	     	<a href="http://easytours/tours/15-day-north-india-visit.htm">	<div onmouseout="this.style.borderColor='#ccc'" onmouseover="this.style.borderColor='#800'" id="result_g_350" style="width: 172px; border: 1px solid #ccc; float: none;  padding-top: 6px; padding-bottom: 6px; font-weight: bold; background-color: #f5f5f5;" align="center">
		<strong>View Detailed Itinerary</strong>
	</div></a>
		

  </div></div>
</div>
</div>
<script>	jQuery.ajax({
    		type: "GET",
    		url: "ajax_comp_links.php",
			beforeSend:function()
				{
					 jQuery('#result_g_613').html('<img src="images/ajax-loader.gif">');
				},
				data:'tour_type=c&fid='+613+'&tour_name='+'15_Day_North_India_Visit'+'&l='+'1,2,3'
				}).done(function( msg ){jQuery("#result_g_613").html(msg)});
</script>
</div>
</div>

<div class=" slider-boxes" style=" border-left:1px dotted #ccc">
<div class="" style="min-height:280px; padding:5px;">  
<div class="city_destinations" style="text-align:center;">
<div class="map_are"><h5><a style="text-decoration:none;" href="http://easytours/tours/17-day-first-visit.htm">17 Day First Visit</a></h5></div><br>
<div><i>Arrive at US - Cochin - Delhi - Goa - Jaipur - Jaisalmer - Jodhpur - Kanha -</i></div><br>
<div style="position: absolute;bottom:0px; left:81px;">
<span class="map" style="width:72px; text-decoration:underline; font-size:12px; padding-bottom:3px;" id="zoom" onclick="large_image_show(617)"><strong>View Map</strong></span>
<div style="padding-top:15px;">Duration - 17 Days</div>
<div class="result_pvt" id="result_g_617" style="font-family:Verdana, Geneva, sans-serif;font-size:12px;  color:#800; line-height:25px; overflow:hidden; margin-top:10px;" align="center"><div>     
	     
      
     
	     	<a href="http://easytours/tours/17-day-first-visit.htm">	<div onmouseout="this.style.borderColor='#ccc'" onmouseover="this.style.borderColor='#800'" id="result_g_478" style="width: 172px; border: 1px solid #ccc; float: none;  padding-top: 6px; padding-bottom: 6px; font-weight: bold; background-color: #f5f5f5;" align="center">
		<strong>View Detailed Itinerary</strong>
	</div></a>
		

  </div></div>
</div>
</div>
<script>	jQuery.ajax({
    		type: "GET",
    		url: "ajax_comp_links.php",
			beforeSend:function()
				{
					 jQuery('#result_g_617').html('<img src="images/ajax-loader.gif">');
				},
				data:'tour_type=c&fid='+617+'&tour_name='+'17_Day_First_Visit'+'&l='+'1,2,3'
				}).done(function( msg ){jQuery("#result_g_617").html(msg)});
</script>
</div>
</div>

<div class=" slider-boxes" style=" border-left:1px dotted #ccc">
<div class="" style="min-height:280px; padding:5px;">  
<div class="city_destinations" style="text-align:center;">
<div class="map_are"><h5><a style="text-decoration:none;" href="http://easytours/tours/20-day-first-visit.htm">20 Day First Visit</a></h5></div><br>
<div><i>Depart from US - Agra - Bangalore - Backwaters - Bandhavgarh - Bodhgaya - Chennai - Chitwan - Cochin - Delhi - Goa - Jaipur - Haridwar - Jodhpur - Kanchipuram - Kanha</i></div><br>
<div style="position: absolute;bottom:0px; left:81px;">
<span class="map" style="width:72px; text-decoration:underline; font-size:12px; padding-bottom:3px;" id="zoom" onclick="large_image_show(609)"><strong>View Map</strong></span>
<div style="padding-top:15px;">Duration - 20 Days</div>
<div class="result_pvt" id="result_g_609" style="font-family:Verdana, Geneva, sans-serif;font-size:12px;  color:#800; line-height:25px; overflow:hidden; margin-top:10px;" align="center"><div>     
	     
      
     
	     	<a href="http://easytours/tours/20-day-first-visit.htm">	<div onmouseout="this.style.borderColor='#ccc'" onmouseover="this.style.borderColor='#800'" id="result_g_320" style="width: 172px; border: 1px solid #ccc; float: none;  padding-top: 6px; padding-bottom: 6px; font-weight: bold; background-color: #f5f5f5;" align="center">
		<strong>View Detailed Itinerary</strong>
	</div></a>
		

  </div></div>
</div>
</div>
<script>	jQuery.ajax({
    		type: "GET",
    		url: "ajax_comp_links.php",
			beforeSend:function()
				{
					 jQuery('#result_g_609').html('<img src="images/ajax-loader.gif">');
				},
				data:'tour_type=c&fid='+609+'&tour_name='+'20_Day_First_Visit'+'&l='+'1,2,3'
				}).done(function( msg ){jQuery("#result_g_609").html(msg)});
</script>
</div>
</div>

<div class=" slider-boxes" style=" border-left:1px dotted #ccc">
<div class="" style="min-height:280px; padding:5px;">  
<div class="city_destinations" style="text-align:center;">
<div class="map_are"><h5><a style="text-decoration:none;" href="http://easytours/tours/22-day-first-visit-with-nepal.htm">22 Day First Visit With Nepal</a></h5></div><br>
<div><i>Delhi - Bodhgaya - Dubai - Goa - Haridwar - Depart at Kathmandu -</i></div><br>
<div style="position: absolute;bottom:0px; left:81px;">
<span class="map" style="width:72px; text-decoration:underline; font-size:12px; padding-bottom:3px;" id="zoom" onclick="large_image_show(610)"><strong>View Map</strong></span>
<div style="padding-top:15px;">Duration - 22 Days</div>
<div class="result_pvt" id="result_g_610" style="font-family:Verdana, Geneva, sans-serif;font-size:12px;  color:#800; line-height:25px; overflow:hidden; margin-top:10px;" align="center"><div>     
	     
      
     
	     	<a href="http://easytours/tours/22-day-first-visit-with-nepal.htm">	<div onmouseout="this.style.borderColor='#ccc'" onmouseover="this.style.borderColor='#800'" id="result_g_360" style="width: 172px; border: 1px solid #ccc; float: none;  padding-top: 6px; padding-bottom: 6px; font-weight: bold; background-color: #f5f5f5;" align="center">
		<strong>View Detailed Itinerary</strong>
	</div></a>
		

  </div></div>
</div>
</div>
<script>	jQuery.ajax({
    		type: "GET",
    		url: "ajax_comp_links.php",
			beforeSend:function()
				{
					 jQuery('#result_g_610').html('<img src="images/ajax-loader.gif">');
				},
				data:'tour_type=c&fid='+610+'&tour_name='+'22_Day_First_Visit_With_Nepal'+'&l='+'1,2,3'
				}).done(function( msg ){jQuery("#result_g_610").html(msg)});
</script>
</div>
</div>
</div>
<br clear="all">
</div>
＆＃13;
＆＃13;
＆＃13;

这是我的小提琴

https://jsfiddle.net/jrfjewmv/

0 个答案:

没有答案
相关问题
最新问题