javascript - bx slider slider 最后一张幻灯片总是隐藏某些部分?

标签 javascript jquery html css bxslider

您好,我正在使用 bxslider 插件并用于最小和最大滑动

但我的问题是我的 slider 总是显示到最后一张幻灯片,有些部分被隐藏了如何解决它。我尝试了一段时间,但没有找到我的代码的任何解决方案

<!DOCTYPE html>
<html>
<head>
	<meta http-equiv="Content-type" content="text/html; charset=utf-8">
	<title>TIL </title>
	
		<!-- Google will often use this as its description of your page/site. Make it good. -->

	    <meta name="google-site-verification" content="">
	    <!-- Speaking of Google, don't forget to set your site up: http://google.com/webmasters -->

	    <meta name="author" content="">
	    <meta name="Copyright" content="Copyright  2015. All Rights Reserved.">

	    <meta name="DC.title" content="Project Name">
	    <meta name="DC.subject" content="What you're about.">
	    <meta name="DC.creator" content="Who made this site.">
	    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0">  
	    

		  <!-- Bootstrap Core CSS -->
      <link href="http://www.buylic.in/css/bootstrap.min.css" rel="stylesheet" />

      <!-- Custom CSS -->
      <link href="http://www.buylic.in/css/modern-business.css" rel="stylesheet" />

      <!-- Custom Fonts -->
      <link href="http://www.buylic.in/font-awesome/css/font-awesome.min.css" rel="stylesheet" type="text/css" />

      <!-- Contact form -->
     <link  rel="stylesheet" type="text/css" />

      <!-- Custom CSS -->
      <link href="http://www.buylic.in/css/jquery.bxslider.css" rel="stylesheet" />
      <!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries -->
      <!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
      <!--[if lt IE 9]>
          <script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script>
          <script src="https://oss.maxcdn.com/libs/respond.js/1.4.2/respond.min.js"></script>
      <![endif]-->
	
	
</head>
<body id="home">
	<!-- Navigation -->
    <div class="">Profolio</div>
  <!-- Header End here -->
  <!-- Body Start here -->
  <!-- Header Carousel -->
   

    <!-- Page Content -->
    <div class="container">
        
        <!-- Marketing Icons Section -->
        <div class="row">
            <div class="col-lg-9">
                <div class="row">
                   asdf asd fasd fasd fasd fasd
                    
                    
                    
                    
                </div>
            </div>
            <div class="col-md-3">
              ============= ------------
            </div>
        </div>
        
        <!-- /.row -->

        <hr>

        <!-- Testimonial Section -->
        <h2>Testimonials</h2>
<div class="well">
	<ul class="bxslider">
	  <li>
	  	<div class="testimonil">
	  		<h5>Rakesh Kumar</h5>
	  		<blockquote class="quotes">
				<p>
					Mes cuml dia sed in lacus ut eniascet etor ingerto aliiqt es sitet amet eismod ictorut dolore ligulate ameti dapi licdu nt mtsent lusto dolor ltisim comme. Mes cuml dia sed inertio lacus ut eniascet ingerto aliiqt sit eism odictor. 
				</p>
			</blockquote>
	  	</div>
	  </li>
	  <li>
	  	<div class="testimonil">
	  		<h5>Vijay Kumar2</h5>
	  		<blockquote class="quotes">
				<p>
					Mes cuml dia sed in lacus ut eniascet etor ingerto aliiqt es sitet amet eismod ictorut dolore ligulate ameti dapi licdu nt mtsent lusto dolor ltisim comme. Mes cuml dia sed inertio lacus ut eniascet ingerto aliiqt sit eism odictor. 
				</p>
			</blockquote>
	  	</div>
	  </li>
	  <li>
	  	<div class="testimonil">
	  		<h5>Rohit Kumar3</h5>
	  		<blockquote class="quotes">
				<p>
					Mes cuml dia sed in lacus ut eniascet etor ingerto aliiqt es sitet amet eismod ictorut dolore ligulate ameti dapi licdu nt mtsent lusto dolor ltisim comme. Mes cuml dia sed inertio lacus ut eniascet ingerto aliiqt sit eism odictor. 
				</p>
			</blockquote>
	  	</div>
	  </li>
	  <li>
	  	<div class="testimonil">
	  		<h5>Suresh Kumar11</h5>
	  		<blockquote class="quotes">
				<p>
					Mes cuml dia sed in lacus ut eniascet etor ingerto aliiqt es sitet amet eismod ictorut dolore ligulate ameti dapi licdu nt mtsent lusto dolor ltisim comme. Mes cuml dia sed inertio lacus ut eniascet ingerto aliiqt sit eism odictor. 
				</p>
			</blockquote>
	  	</div>
	  </li>
	  <li>
	  	<div class="testimonil">
	  		<h5>Ravi Kumar22</h5>
	  		<blockquote class="quotes">
				<p>
					Mes cuml dia sed in lacus ut eniascet etor ingerto aliiqt es sitet amet eismod ictorut dolore ligulate ameti dapi licdu nt mtsent lusto dolor ltisim comme. Mes cuml dia sed inertio lacus ut eniascet ingerto aliiqt sit eism odictor. 
				</p>
			</blockquote>
	  	</div>
	  </li>
	  <li>
	  	<div class="testimonil">
	  		<h5>Rakesh Kumar33</h5>
	  		<blockquote class="quotes">
				<p>
					Mes cuml dia sed in lacus ut eniascet etor ingerto aliiqt es sitet amet eismod ictorut dolore ligulate ameti dapi licdu nt mtsent lusto dolor ltisim comme. Mes cuml dia sed inertio lacus ut eniascet ingerto aliiqt sit eism odictor. 
				</p>
			</blockquote>
	  	</div>
	  </li>
	</ul>
</div>    </div>
    <!-- /.container -->
    <!-- =========================================================================== -->
    
    <!-- =========================================================================== -->
    <!-- Footer here  -->
     <!-- Footer here  -->
     <footer class="footer">
            <div class="container">
                <div class="row">
                    <div class="col-lg-12">
                        <hr />
                        <ul class="footerLinking">
                            <li><a href="index.html">Home</a></li>
                        </ul>
                    </div>
                </div>
                <div class="row">
                    <div class="col-lg-12">
                        Rohit azad
                    </div>
                </div>
            </div>
        </footer>
    <!-- Footer here end  -->
    <!-- jQuery -->
    <script src="http://www.buylic.in/js/jquery.js"></script>

    <!-- Bootstrap Core JavaScript -->
    <script src="http://www.buylic.in/js/bootstrap.min.js"></script>

    <script src="http://www.buylic.in/js/jquery.bxslider.min.js"></script>
    <!-- Contact form -->
    <script >
$(document).ready(function(){
    $('.bxslider').bxSlider({
        controls: false,
        minSlides: 1,
        maxSlides: 3,
        slideWidth: 300,
        slideMargin: 10
    });

});    
    </script>
    <script ></script>

</body>

</html>		

最佳答案

把这个放在你的CSS中

      .bx-wrapper {
       max-width: 930px!important;
           }

关于javascript - bx slider slider 最后一张幻灯片总是隐藏某些部分?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/35124317/

相关文章:

javascript - 网络 ERP 系统。打印系统发票,无需编辑、下载

输出数组时Javascript未定义消息

javascript - jQuery UI 选项卡效果不起作用

javascript - 从下拉菜单访问选定值

jquery - 无论如何检查容器高度并相应地更改 CSS?

php - 在同一页面中显示目标 url 的 javascript 或 jquery 弹出窗口

javascript - 导航栏立即跳转到顶部

javascript - Uncaught Error : [$injector:modulerr] & Uncaught ReferenceError: app is not defined

javascript - TypeScript 和 Vue 类 - TS7053 索引签名

javascript - 在 AngularJS 中完全加载页面后执行函数