»
EnglishFrenchVietnamese

Print - Interactive image slideshow with text description - JavaScriptBank.com

Full version: jsB@nk » Image » Slideshow » Interactive image slideshow with text description
URL: https://www.javascriptbank.com/interactive-image-slideshow-with-text-description.html

Interactive image slideshow with text description © JavaScriptBank.comAn incredibly cool DHTML image slideshow. Features manual/ automatic cycling, and accompany text description of each image. Requires IE 4+/NS6+ to work.

Full version: jsB@nk » Image » Slideshow » Interactive image slideshow with text description
URL: https://www.javascriptbank.com/interactive-image-slideshow-with-text-description.html



JavaScript
<script language="JavaScript1.2">/*Interactive Image slideshow with text descriptionBy Christian Carlessi Salvadó (cocolinks@c.net.gt). Keep this notice intact.*/g_fPlayMode = 0;g_iimg = -1;g_imax = 0;g_ImageTable = new Array();function ChangeImage(fFwd){if (fFwd){if (++g_iimg==g_imax)g_iimg=0;}else{if (g_iimg==0)g_iimg=g_imax;g_iimg--;}Update();}function getobject(obj){if (document.getElementById)return document.getElementById(obj)else if (document.all)return document.all[obj]}function Update(){getobject("_Ath_Slide").src = g_ImageTable[g_iimg][0];getobject("_Ath_FileName").innerHTML = g_ImageTable[g_iimg][1];getobject("_Ath_Img_X").innerHTML = g_iimg + 1;getobject("_Ath_Img_N").innerHTML = g_imax;}function Play(){g_fPlayMode = !g_fPlayMode;if (g_fPlayMode){getobject("btnPrev").disabled = getobject("btnNext").disabled = true;Next();}else {getobject("btnPrev").disabled = getobject("btnNext").disabled = false;}}function OnImgLoad(){if (g_fPlayMode)window.setTimeout("Tick()", g_dwTimeOutSec*1000);}function Tick() {if (g_fPlayMode)Next();}function Prev(){ChangeImage(false);}function Next(){ChangeImage(true);}////configure below variables///////////////////////////////configure the below images and description to your own. g_ImageTable[g_imax++] = new Array ("logojs.gif", "It's a logo");g_ImageTable[g_imax++] = new Array ("photo1.jpg", "Photo 1");g_ImageTable[g_imax++] = new Array ("photo2.jpg", "Photo 2");g_ImageTable[g_imax++] = new Array ("photo3.jpg", "Photo 3");g_ImageTable[g_imax++] = new Array ("photo4.jpg", "Photo 4");//extend the above list as desiredg_dwTimeOutSec=2////End configuration/////////////////////////////if (document.getElementById||document.all)window.onload=Play</script><!--    This script downloaded from www.JavaScriptBank.com    Come to view and download over 2000+ free javascript at www.JavaScriptBank.com-->


HTML
<p><input type="button" id="btnPrev" value="<< Previous" onclick="Prev();"> <input type="button" id="bntPlay" value="Play - Stop" onclick="Play()"> <input type="button" id="btnNext" value="  Next >>  " onclick="Next();"></p><p><img id="_Ath_Slide" onload="OnImgLoad()"> </p><p><b>Description:</b> <SPAN id="_Ath_FileName"> </SPAN> <br><b>Number of Pictures: <SPAN id="_Ath_Img_X"></SPAN> of <SPAN id="_Ath_Img_N"></SPAN></b></p><!--    This script downloaded from www.JavaScriptBank.com    Come to view and download over 2000+ free javascript at www.JavaScriptBank.com-->