Populating a Carousel using Ajax content (initially or on demand)
Step Carousel lets you define the contents for it (the panels themselves) inside an external file on your server, instead of directly inline on the page. This way when you update the external file, all carousels on your site that reference this file gets updated automatically. There are two ways to specify Ajax content for a Carousel- 1) from the start when it first loads on the page, or 2) for a Carousel already loaded on the page, on demand when an action is called.
Using an external file as the default contents of a Carousel
You can specify that a Carousel gets its panel contents from an external file
by default when it loads on the page. Firstly, inside your initialization code
in the HEAD section of your page, set the
where "external2.htm" should be a blank page containing just the HTML of your
Carousel panels themselves (ie:
<div class="panel" style="width: 150px;
Since your Step Carousel is now getting its contents from this external file, the markup for it on your script page should now be devoid of the panels' HTML:
<div id="mygallery" class="stepcarousel">
Updating a Carousel with external Ajax content on demand
You can also dynamically update the contents of any Carousel after it's
loaded on the page with new content from an external file. Simply call the
For example, the below link when clicked on will update the Carousel with ID "
Table Of Contents