Thursday, 15 March 2012

flexslide animation using jquery and html -



flexslide animation using jquery and html -

i wrote animation code below doesn't work (i've added jquery(jquery-1.9.1.js) , flexslider(jquery.flexslider-min.js) files project). hav u ideas?

html code

<div class="slider"> <ul class="slides"> <li> <img src="images/demo_image_26.jpg" alt="" /> <div class="slider-caption-wrapper"> <div class="slider-caption"> <p class="colour-caption medium-caption">100% responsive &amp; mobile ready</p> <div class="clearboth"></div> <p class="dark-caption large-caption">room availability checker , booking</p> </div> </div> </li> <li> <img src="images/demo_image_06.jpg" alt="" /> <div class="slider-caption-wrapper"> <div class="slider-caption"> <p class="colour-caption medium-caption">5 fantastic home pages take from</p> <div class="clearboth"></div> <p class="dark-caption large-caption">customer testimonials &amp; event management</p> </div> </div> </li> <li> <img src="images/demo_image_25.jpg" alt="" /> <div class="slider-caption-wrapper"> <div class="slider-caption"> <p class="colour-caption medium-caption">fully customizable colour scheme</p> <div class="clearboth"></div> <p class="dark-caption large-caption">4 pre configured colour schemes available</p> </div> </div> </li> </ul>

js code

<script type="text/javascript" charset="utf-8"> $(window).load(function() { $('.slider').flexslider({ slideshow: true }); }); </script>

you need add together flexsider css file. think have missed in code. have created 1 fiddle code , copied flexsider javascript , css file site. after working fine misalignments. check fiddle here.

$(window).load(function() { $('.slider').flexslider({ slideshow: true, slideshowspeed: 2000 }); });

jquery html flexslider

No comments:

Post a Comment