7-7 xotpl/contentslider.html

<link rel="stylesheet" type="text/css" href="<{xoImgUrl css/contentslider.css}>" />
<script type="text/javascript" src="<{xoImgUrl js/contentslider.js}>"></script>


<div id="templatemo_banner_panel">
  <!--Inner content DIVs should always carry "contentdiv" CSS class-->
  <!--Pagination DIV should always carry "paginate-SLIDERID" CSS class-->
  <div id="paginate-slider2" class="pagination2">
    <{foreach from=$slider_var item=slider}>
      <a href="#" class="toc">&nbsp;</a>
    <{/foreach}>
  </div>

  <div id="slider2" class="sliderwrapper">

    <{foreach from=$slider_var item=slider}>
      <div class="contentdiv"><img src="<{$slider.file_url}>" alt="image <{$slider.sort}>0" /></div>
    <{/foreach}>

  </div>
  <script type="text/javascript">

    featuredcontentslider.init({
      id: "slider2",  //id of main slider DIV
      contentsource: ["inline", ""],  //Valid values: ["inline", ""] or ["ajax", "path_to_file"]
      toc: "markup",  //Valid values: "#increment", "markup", ["label1", "label2", etc]
      nextprev: ["Previous", "Next"],  //labels for "prev" and "next" links. Set to "" to hide.
      revealtype: "click", //Behavior of pagination links to reveal the slides: "click" or "mouseover"
      enablefade: [true, 0.2],  //[true/false, fadedegree]
      autorotate: [true, 3000],  //[true/false, pausetime]
      onChange: function(previndex, curindex){  //event handler fired whenever script changes slide
      //previndex holds index of last slide viewed b4 current (1=1st slide, 2nd=2nd etc)
      //curindex holds index of currently shown slide (1=1st slide, 2nd=2nd etc)
      }
    })
  </script>
</div>