Dynamic Content Slider

Dynamic Content Slider

$(document).ready(function(){

//Dynamic DIV ID
var childDivs=$(“#tabsection div”);
for(var i=0;i<childDivs.length;i++)
{
$(childDivs[i]).attr("id","t0"+i);
}

$('#t00').show();

// Add div to the dynamic array
var ids = [];
$("#tabsection").children("div").each(function(){
ids.push(this.id);
});

// Asign values from array
var a = 0;
var b = ids.length;
var tt = a + 1;
var s = tt + "of"+b;
var y = "#"+ids[a];
$('#output').text(s);

//next function
$('#next').on('click', function(){
a = a+1;
if( a==b ){
a = 0;
}
var nn = a + 1;
var s = nn + "of"+b;
var y = "#"+ids[a];
$('#output').text(s);
$("#tabsection").children("div").hide();
$(y).fadeIn(1000);
});

//prev function
$('#prev').on('click', function(){
a = a-1;
if( a<0 ){
a = (b-1);
}
var nn = a + 1;
var s = nn + "of"+b;
var y = "#"+ids[a];
$('#output').text(s);
$("#tabsection").children("div").hide();
$(y).fadeIn();
});

});

Advertisements

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s