jquery Carousel Plugin Bxslider

Introducing Files

<link h<script type= "Text/javascript" src= "Js/jquery-1.9.1.min.js" ></script>
<script type= "Text/javascript" src= "Js/jquery.bxslider.js" ></script>

<link href= "Css/jquery.bxslider.css" rel= "stylesheet" type= "Text/css" >

CSS style around key

. bx-prev{width:30px; height:30px; background: #f00; text-indent: -999999px; Z-index:999;position:absolute;  Float:left; }
. bx-next{width:30px; height:30px; background: #f00; text-indent: -999999px; z-index:999; position:absolute; Float:right; }

Parameter description:

Bxslider Detailed configuration parameters:
Bxslider has a number of configuration parameters that allow you to create a variety of slider effects with parameters:

Example reference
<script type= "Text/javascript" >

$ (document). Ready (function () {
$ (' Select the Carousel area (. Slider) '). Bxslider ({
Mode: ' fade ',
Picture width
slidewidth:1920,
SLIDEMARGIN:20,
Controls:true,
Auto Jump
Auto:true,
Autodirection: ' Next ',
pause:3000,
});
});
</script>

< moving direction >

Mode: ' horizontal ',//' horizontal ', ' vertical ', ' fade ' defines the direction of slider scrolling, with three values to choose from
Infiniteloop:true,//True, False-display first slide after last infinite loop
Hidecontrolonend:false,//True, false-if true, would hide ' next ' control on last slide and ' prev ' control on first if set True, "Next" will be hidden in the last slide, so "prev" on the front slide
Controls:true,//True, false-previous and next controls whether the "previous" and "Next" buttons are displayed
speed:500,//integer-in MS, duration of time slide transitions would occupy speed, in milliseconds
Easing: ' Swing ',//used with Jquery.easing.1.3.js-see http://gsgd.co.uk/sandbox/jquery/easing/for available options
Pager:true,//True/false-display a pager
Pagerselector:null,//JQuery selector-element to contain the pager. Ex: ' #pager '
Pagertype: ' Full ',//' full ', ' short '-if ' full ' pager displays ... If ' short ' pager displays 1/4 if set to full, it will show the ..., if set short, 1/4 will be displayed.
Pagerlocation: ' Bottom ',//' bottom ', ' top '-location of the pager page number
Pagershortseparator: '/',//String-ex: ' of ' pager would display 1 of 4 page separators
Pageractiveclass: ' pager-active ',//string-classname attached to the active pager link current page number classname
Nexttext: ' Next ',//String-text displayed text for ' Next ' control next page
NextImage: ',//String-filepath of image used for ' next ' control. Ex: ' Images/next.jpg ' can set the next page as a picture
Nextselector:null,//JQuery selector-element to contain the next control. Ex: ' #next '
Prevtext: ' prev ',//String-text displayed for ' previous ' control previous page of text
Previmage: ',//String-filepath of image used for ' previous ' control. Ex: ' images/prev.jpg ' pictures on previous page
Prevselector:null,//JQuery selector-element to contain the previous control. Ex: ' #next '
Captions:false,//True, False-display image captions (reads the image ' title ' tag) displays the title of the picture, reading the contents of the title property of the picture.

< auto play >
Captionsselector:null,//JQuery selector-element to contain the captions. Ex: ' #captions '
Auto:false,//True, False-make slideshow change automatically slide auto-scroll
Autodirection: ' Next ',//' Next ', ' prev '-direction in which auto show would traverse auto-scroll order
Autocontrols:false,//True, False-show ' start ' and ' Stop ' controls for auto Show auto-scroll control keys
Autocontrolsselector:null,//JQuery selector-element to contain the auto controls. Ex: ' #auto-controls '
Autostart:true,//True, False-if false show would wait for ' start ' control to activate
Autohover:false,//True, False-if True show will pauses on mouseover setting mouse mouseover would make automatic scrolling pause
autodelay:0,//integer-in MS, the amount of time before starting the auto show
pause:3000,//Integer-in MS, the duration between each slide transition transition time
Starttext: ' Start ',//String-text displayed for ' Start ' Control Start button text
Startimage: ',//String-filepath of image used for ' start ' control. Ex: Picture of ' images/start.jpg ' Start button
Stoptext: ' Stop ',//String-text displayed text for ' Stop ' control stop button
Stopimage: ',//String-filepath of image used for ' Stop ' control. Ex: Picture of ' images/stop.jpg ' stop button
Ticker:false,//True, False-continuous motion ticker mode (think news ticker)
Note:autocontrols and Autocontrolsselector apply to ticker!
tickerspeed:5000,//Integer-has an inverse effect on speed. Therefore, a value of 10000 would
Scroll very slowly while a value of ~ scroll very quickly.
Tickerdirection: ' Next ',//' Next ', ' prev '-direction in which ticker show'll traverse
Tickerhover:false,//True, False-if true ticker would pause on mouseover
Wrapperclass: ' Bx-wrapper ',//string-classname attached to the slider Wraper
startingslide:0,//Integer-show'll start on specified slide. Note:slides is zero based!
Displayslideqty:1,//Integer-number of slides to display at once
Moveslideqty:1,//Integer-number of slides to move at once
Randomstart:false,//True, False-if true show would start on a random slide

jquery Carousel Plugin Bxslider