jquery - Having problems implementing bxSlider onto a webpage -

is else having problems implementing http://bxslider.com/ slider onto webpage because doing right instructions have said slider not appear, 4 images 1 below other appear on page.

here how have implemented mine:

step 1: link required files:

<!-- jquery library (served google) --> <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script> <!-- bxslider javascript file --> <script src="jquery.bxslider.min.js"></script> <!-- bxslider css file --> <link href="jquery.bxslider.css" rel="stylesheet" /> 

step 2: create html markup

<ul class="bxslider"> <li><img src="images/pic1.jpg" /></li> <li><img src="images/pic2.jpg" /></li> <li><img src="images/pic3.jpg" /></li> <li><img src="images/pic4.jpg" /></li> </ul> 

step 3: call bxslider

<script type="text/javascript"> $(document).ready(function(){ $('.bxslider').bxslider({ }); }); 

i seem calling function fine , think somewhere in css failing show slider. not sure though, appreciate if can find out i'm going wrong.

if require me post full css file please ask don't think necessary.