jquery - How to add captions to slideshow -


i tried many ways add captions slideshow, couldn't. want add div on bottom of each image, should change script? or should add else?

html:

<div class="minislider">      <img src="http://www.no-margin-for-errors.com/wp-content/themes/nmfe/images/fullscreen/1.jpg" />      <img src="http://www.no-margin-for-errors.com/wp-content/themes/nmfe/images/fullscreen/2.jpg" />      <img src="http://www.no-margin-for-errors.com/wp-content/themes/nmfe/images/fullscreen/3.jpg" />      <img src="http://www.no-margin-for-errors.com/wp-content/themes/nmfe/images/fullscreen/4.jpg" /> </div> 

css:

.minislider {     width: 321px;     height: 242px;     background-color: #649696;     position: relative;     float: left;     left: 76px;     top: 11px;     border-radius: 10px 10px 10px 10px; }  .minislider img {     width: 311px;     height: 232px;     position: absolute;     left: 5px;     top: 5px; } 

jquery:

$(document).ready(function (){     $('.minislider img:gt(0)').hide();     setinterval(function(){         $('.minislider :first-child').fadeout()             .next('img').fadein()             .end().appendto('.minislider');         }, 3000); }); 

http://jsfiddle.net/pedram68/tntpq/

like putvande said, have wrap image , caption in div, have edit jquery bit:

$(document).ready(function (){     $('.minislider>div:gt(0)').hide(); //".minislider>div" instead of ".minislider div" in case planning on putting div inside div.     setinterval(function(){         $('.minislider>div:first-child').fadeout()             .next('div').fadein()             .end().appendto('.minislider');         }, 3000); }); 

Comments

Popular posts from this blog

css - Which browser returns the correct result for getBoundingClientRect of an SVG element? -

gcc - Calling fftR4() in c from assembly -

Function that returns a formatted array in VBA -