jquery - bxslider only working on vertical scroll, not horizontal -

i'm trying implement bxslider on website sidebar reason working when set mode "vertical" when set mode "horizontal," should default, or put nothing @ mode, slider transitions not work. i'm trying accomplish slider showing 1 slide @ time , auto transitioning next slide vertical scroll working still have manually hit pager next slide. i'm kind've stumped on problem.

<ul class="bxslider">     <li>         <div>             <img class="img-responsive" src="/wp-content/themes/axon-responsive/images/slide1.png" />             <br>             <quote>“axon radiology reliable , timely great response on questions or issues.”</quote>             <hr>             <p>brandon selle</p>             <span>northeast missouri imaging associates</span>         </div>     </li>     <li>         <div>             <img class="img-responsive" src="/wp-content/themes/axon-responsive/images/slide2.png" />             <quote>“we changed radiology groups due inaccurate reads our previous vendor. extremely happy axon radiology , quality of service providing our company. believe axon radiology takes pride in performance of radiologists. speedy turnaround , excellent reporting company.”                 </p>                 <hr>                 <p>theresa summers</p>                 <span>georgia emergency associates</span>         </div>     </li>     <li>         <div>             <img class="img-responsive" src="/wp-content/themes/axon-responsive/images/slide3.png" />             <quote>“our prior teleradiology services had long wait times reports, after calling , stating patient priority patient. 1 service reports not accurate in addition extended wait time. axon radiology dependable, accurate , provides fast report turnaround times. pleased services provided , happy recommend others."</quote>             <hr>             <p>tammy cullen</p>             <span>cypress creek er</span>         </div>     </li>     <li>         <div>             <img class="img-responsive" src="/wp-content/themes/axon-responsive/images/slide4.png" />             <quote>“excellent service results can trust.”</quote>             <hr>             <p>yadira sanchez</p>             <span>saddleback family & urgent care medical group</span>         </div>     </li>     <li>         <div>             <img class="img-responsive" src="/wp-content/themes/axon-responsive/images/slide2.png" />             <quote>“axon helps achieve goal providing on reads in little 20 minutes. our previous provider unable this. happy service provided axon radiology. easy , staff helpful , easy work with. every time have reached out or more information interface, etc. have received support , guidance. appreciate effort axon puts helping customers grow.”</quote>             <hr>             <p>lisa horton</p>             <span>georgia emergency associates</span>         </div>     </li> </ul> 

my jquery

jquery(function ($) {  $(document).ready(function(){     $('.bxslider').bxslider({         mode: 'horizontal',         slidewidth: 240,         minslides: 1,         slidemargin: 10,         controls: 'false',         pager: 'true',         moveslides: '1',         autostart: 'true',         auto: true;  }); }); }); 

i able fix this. css error giving bxslider max width.