The following is a small demo, a slideshow from images. This demo was created with a new JavaScript library, JQuery. JQuery library is known for making JavaScript coding fun. When using this demo you must keep the copyright notice for each Interface’s JavaScript source file.

<pre class="brush: php; highlight: [5, 15]; html-script: true">

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"  "">
<html  xmlns="">
<base  href="">
 <style type="text/css"> 
 body {color: white;background: #52616F;}
 a {  color:  white; }
<meta  http-equiv="Content-Type" content="text/html; charset=utf-8"  />
<title>Slideshow demo - Interface plugin for jQuery</title>
 <script type="text/javascript"  src="javascript/jquery.js"></script>
 <script type="text/javascript" src="javascript/interface.js"></script>
 <link   type="text/css"       href="css/interface-slideshow.css"  rel="stylesheet">

<p>Interface  Slideshow demo - Interface plugin for jQuery</p>
<div  id="slideShow1" style="text-align: left;"></div>

<script  type="text/javascript">
 container :  'slideShow1',
 loader: 'images/slideshow_loader.gif',
 linksPosition: 'top',
 linksClass: 'pagelinks',
 linksSeparator : ' | ',
 fadeDuration : 400,
 activeLinkClass: 'activeSlide',
 nextslideClass: 'nextSlide',
 prevslideClass: 'prevSlide',
 captionPosition: 'bottom',
 captionClass: 'slideCaption',
 autoplay: 5,
 random: true,
 images : [
 src: 'images/panda/Dynamic.jpg',
 caption: 'Panda Dynamic'
 src:  'images/panda/Actual.jpg',
 caption: 'Panda Actual'
 src: 'images/panda/Panda.jpg',
 caption: 'Fiat  Panda'
 src: 'images/panda/Active.jpg',
 caption: 'Panda Active'

 className: 'inputsTooltip',
 position: 'mouse'
<pre class="brush: php; highlight: [5, 15]; html-script: true">

Leave a Reply