Loading...

Titel der neuen Seite


02
03

slide #1

04
05
06

slide #2

07
08
09

slide #3

10
11
12

slide #4

13
14
15

slide #5

16
17
2. Import both jQuery library and the 'infiniteSlider2.js' script into the webpage. 1 2 3. Active the slider by calling the function on the top container. 1 $('#infinite-slider2').infiniteSlider2(); 4. Config the slider with the following options. view source 01 $('#infinite-slider2').infiniteSlider2({ 02 03 // general defaults 04 width: 100, 05 height: 'auto', 06 arrows: true, 07 toggles: true, 08 labels: true, 09 10 // slide background defaults 11 slideBackgroundColor: [ 12 '#5eabe7', 13 '#cca27e', 14 '#7e4c39', 15 '#83595e', 16 '#2e2432' 17 ], 18 slideBackgroundImage: [], 19 20 // arrow defaults 21 arrowWidth: 32, 22 arrowHeight: 76, 23 arrowMargin: 20, 24 arrowBackgroundColor: '', 25 arrowBackgroundImageRight: '', 26 arrowBackgroundImageLeft: '', 27 arrowFill: 'white', 28 arrowOpacity: 0.4, 29 arrowAnimate: true, 30 31 // toggle defaults 32 toggleShape: 'circle', 33 toggleWidth: 16, 34 toggleHeight: 16, 35 toggleGutter: 8, 36 toggleOpacity: 1, 37 toggleColor: '', 38 toggleActiveColor: '', 39 toggleBorder: '3px solid rgba(255, 255, 255, 0.4)', 40 toggleActiveBorder: '3px solid white', 41 toggleMargin: 30, 42 toggleAnimate: true, 43 44 // label defaults 45 slideLabelWidth: 74, 46 slideLabelHeight: 74, 47 slideLabelBorderWidth: 3, 48 slideLabelBorderStyle: 'solid', 49 slideLabelBorderColor: 'rgba(255, 255, 255, 0.4)', 50 slideActiveLabelBorderColor: 'white', 51 slideLabelBackgroundColor: [ 52 '#5eabe7', 53 '#cca27e', 54 '#7e4c39', 55 '#83595e', 56 '#2e2432' 57 ], 58 slideLabelImage: [], 59 60 // advanced defaults 61 autoplay: true, 62 slideInterval: 6000, 63 slideDuration: 600, 64 cursor: 'pointer' 65 66 });