Specifying an external file source for the gliding contents
The default configuration assumes that your glided contents are DIVs with a
shared CSS class name (ie: "
glidecontent") and added directly
inline within your page:
<div id="canadaprovinces" class="glidecontentwrapper">
<img src="http://i11.tinypic.com/8efzmmf.jpg" style="float: left; padding: 5px" />
British Columbia is the westernmost of Canada's provinces and is famed for its natural beauty. It's capital is Victoria, located at the southeastern tip of Vancouver Island. BC's most populous city is Vancouver, located in southwest corner of the BC mainland called the Lower Mainland.
<img src="http://i15.tinypic.com/72vilba.jpg" style="float: right; padding: 5px"/>
Ontario is a province located in the central part of Canada, the largest by population and second largest, after Quebec in total area. Toronto, the capital of Ontario, is the centre of Canada's financial services and banking industry.
<img src="http://i17.tinypic.com/8bg0lkx.jpg" style="float: left; padding: 5px"/>
Yukon, still commonly referred to as "The Yukon Territory", is the westernmost of Canada's three northern territories. The Yukon's major appeal is its nearly pristine nature. Tourism relies heavily on this and there are many organised outfitters and guides available to hunters and anglers and nature lovers of all sorts.
The 3 DIVs in bold above are what we're referring to. You can, if you wish,
move these DIVs (the gliding contents) to an external file on your server, and
tell the script to retreive that file to populate the glider using. Simply
create a blank file with the DIVs above added inside it- the same syntax
conventions exist here, that is, each content must be wrapped around its own DIV
with a shared CSS class name (in this case, "
you end up with is for example: "glidecontent.htm" Then, to tell
the script to get its content from this file instead, define the configuration
remotecontent" when initializing the script:
gliderid: "canadaprovinces", //ID of main glider container
contentclass: "glidecontent", //Shared CSS class name of each glider content
togglerid: "p-select", //ID of toggler container
remotecontent: "glidecontent.htm", //Get gliding contents from external file on server? "filename" or "" to disable
And that's it! Note that "glidecontent.htm" must be on the same domain as where your Featured Content Glider, due to Ajax security limitations. A live example here:
The pagination links still need to be defined manually, but you can always define more than what's needed, as the script will dynamically hide redundant pagination links based on how many gliding contents there actually are.
Table Of Contents