给予固定的高度宽度图像不显示完整的图像

Question

我已经像slider.that幻灯片从表图像database.to出示适当的滑块我给固定的高度宽度图像这样

<asp:Content ID="Content1" ContentPlaceHolderID="head" runat="Server"> 
<style type="text/css" media="screen"> 
    .slides_container { 
     width: 1000px; 
     height: 475px; 
    } 

    .slides_container div { 
     width: 1000px; 
     height: 475px; 
     display: block; 
    } 
    #newslides .slidesjs-previous { 
     position: absolute; 
     top: 25%; 
     left: 2%; 
     z-index:999; 
    } 
    #newslides .slidesjs-next{ 
     position: absolute; 
     top: 25%; 
     right: 2%; 
     z-index:999; 
    } 

</style> 

<asp:Content ID="Content3" ContentPlaceHolderID="ContentPlaceHolder2" runat="Server"> 
<div class="breadcrumb"> 
    <a href="News.aspx">News</a> <span>&gt;</span> Photo Gallery 
</div> 

<asp:Content ID="Content2" ContentPlaceHolderID="ContentPlaceHolder1" runat="Server"> 
<div id="container"> 
    <div id="example"> 
     <div id="newslides" > 
      <asp:Repeater ID="rptGallery" runat="server"> 
       <ItemTemplate> 
        <div class="slides_container"> 
         <div style="float: left; height: 27px; width: 1000px; font-size: 18px;"> 
          <span style="float: left"><%# Eval("Title") %> </span> 
          <span style="float: right"><%# Eval("PhotoCredit") %> </span> 
         </div> 
         <img src='<%# Eval("FileURL") %>' width="1000" height="475" alt="Slide 1"> 
        </div> 

       </ItemTemplate> 
      </asp:Repeater> 

      <a href="#" class="slidesjs-previous slidesjs-navigation" > 
       <img src="images/prevArrow.png" width="50" height="43" alt="Arrow Prev"> 
      </a> 
      <a href="#" class="slidesjs-next slidesjs-navigation" > 
       <img src="images/nextArrow.png" width="50" height="43" alt="Arrow Next"> 
      </a> 

     </div> 


    </div> 
</div> 

<script src="Scripts/jquery.slides.min.js" type="text/javascript"></script> 
<script type="text/javascript"> 
    $(function() { 

     $('#newslides').slidesjs({ 
      width: 940, 
      height: 250, 
      navigation: { 
       active: false, 
       effect: "slide", 

      }, 
      pagination: { 
       active: false, 
       // [boolean] Create pagination items. 
       // You cannot use your own pagination. Sorry. 
       effect: "fade" 
       // [string] Can be either "slide" or "fade". 
      }, 
      play: { 
       active: true, 
       auto: true, 
       interval: 2000, 
       swap: true, 
       pauseOnHover: true, 
       restartDelay: 2500, 

      } 
     }); 
    }); 
</script> 

但是，由于该图像crops.it没有显示完整的图像在slider.any解决方案为此。提前预感

Answer 1

您正在使用错误的滑块尺寸。

更新您的

$('#newslides').slidesjs({ 
     width: 940, // change width to 1000 
     height: 250, // change height to 475 
     ....