1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 | <!-- DC Flex Slider CSS --> < link rel = "stylesheet" href = "dcodes/sliders/css/flex/flexslider.css" type = "text/css" media = "screen" /> <!-- requires jquery library --> <!-- Modernizr --> < script src = "dcodes/sliders/js/flex/modernizr.js" ></ script > <!-- DC Flex Slider JS --> < script defer src = "dcodes/sliders/js/flex/jquery.flexslider.js" ></ script > <!-- requires easing library --> < script src = "dcodes/sliders/js/flex/jquery.easing.js" ></ script > < script src = "dcodes/sliders/js/flex/jquery.mousewheel.js" ></ script > <!-- DC Flex Slider Start --> < div id = "dc_flex_container" role = "dc_flex_container" > < section class = "f_slider" > < div id = "f_slider" class = "flexslider" > < ul class = "fslides" > </ ul > </ div > < div id = "flex_carousel" class = "flexslider" > < ul class = "fslides" > </ ul > </ div > </ section > </ div > <!-- DC Flex Slider End --> < div class = "dc_clear" ></ div > <!-- line break/clear line --> <!-- DC Flex Slider Settings --> < script type = "text/javascript" > $(window).load(function(){ // Thumbnail Carousel $('#flex_carousel').flexslider({ animation: "slide", controlNav: true, // Create navigation for paging control of each clide? Note: Leave true for manualControls usage animationLoop: true, // Should the animation loop? If false, directionNav will received "disable" classes at either end slideshow: false, // Animate slider automatically startAt: 0, // The slide that the slider should start on. Array notation (0 = first slide) touch: true, // Allow touch swipe navigation of the slider on touch-enabled devices video: false, // if using video in the slider, will prevent CSS3 3D Transforms to avoid graphical glitches itemWidth: 140, // Box-model width of individual carousel items, including horizontal borders and padding. itemMargin: 5, // Margin between carousel items. asNavFor: '#f_slider' // Internal property exposed for turning the slider into a thumbnail navigation for another slider }); $('#f_slider').flexslider({ // Banner Slider animation: "slide", controlNav: false, // Create navigation for paging control of each clide? Note: Leave true for manualControls usage animationLoop: false, // Should the animation loop? If false, directionNav will received "disable" classes at either end slideshow: true, // Animate slider automatically slideshowSpeed: 4000, // Set the speed of the slideshow cycling, in milliseconds animationSpeed: 600, // Set the speed of animations, in milliseconds smoothHeight: true, // Allow height of the slider to animate smoothly in horizontal mode sync: "#flex_carousel", // Mirror the actions performed on this slider with another slider. Use with care. start: function(slider){ $('body').removeClass('loading'); } }); }); </ script > |
© TemplateAccess