Kity Photo Album

[Total: 0    Average: 0/5]

This script has tons of features:

Head Code:

<SCRIPT Language="Javascript">
<!--    
/*
 * Modified script to be DOM compatible. (JSX November, 2002)
 */
var isIE=document.all?true:false;
var isDOM=document.getElementById?true:false;
/***************************************************************
 * Suzy's Javascript Photo Album, version 2.0, April 24, 2001  *
 *                                                             *
 * This javascript code may be used on other Websites if:      *
 * 1) This notice is left unchanged                            *
 * 2) A link to http://www.kitykity.com is placed on that page *
 * You may contact me at kitykity@usa.com for assistance.      *
 *                                                             *
 * If you like this script, please visit this link and help me *
 * put my kids through college:                                *
 * http://s1.amazon.com/exec/varzea/pay/T2H7HTBWK2CRO8         *
 ***************************************************************/
current = 0;
PicVar = 0;

PicVal = new Array();
TitVal = new Array();
DatVal = new Array();
TxtVal = new Array();

// *** Change the information in between the quotes to match your pictures. ***
PicVal[PicVar] = "http://www.js-examples.com/images/red_ball0.gif";
TitVal[PicVar] = "Picture 1";
DatVal[PicVar] = "4/23/2001";
TxtVal[PicVar++] = "Description of picture 1.";

PicVal[PicVar] = "http://www.js-examples.com/images/yellow_ball0.gif";
TitVal[PicVar] = "Picture 2";
DatVal[PicVar] = "4/23/2001";
TxtVal[PicVar++] = "Description of picture 2.";

function ShowSuzyPic(newpic) {
  if(isDOM)document.getElementById("suzypic").src = PicVal[newpic];
  else if(isIE) document.SuzyPic.src = PicVal[newpic];
  document.SuzyForm.SuzyText.value=TxtVal[newpic];
  document.SuzyForm.SuzyDate.value=DatVal[newpic];
  SelectionBox = document.SuzyForm.SuzyDropdown;
  SelectionBox.options[newpic].selected = true;
  current = newpic;
}
function RandomSuzyPic() {
  TotalImages = document.SuzyForm.SuzyDropdown.options.length;
  current = Math.floor(Math.random()*TotalImages);
  ShowSuzyPic(current);
}
function PreviousSuzyPic() {
  TotalImages = document.SuzyForm.SuzyDropdown.options.length;
  current--;
  if(current<0) current = TotalImages - 1;
  ShowSuzyPic(current);
}
function NextSuzyPic() {
  TotalImages = document.SuzyForm.SuzyDropdown.options.length;
  current++;
  if (current>=TotalImages) current = 0;
  ShowSuzyPic(current);
}
// -->
</SCRIPT>

Body Code:

<FORM NAME="SuzyForm">
<table border=0 width=100% height=100%>
<tr align=center><td height=30>
<font style="font:12pt">Welcome to Suzy's Javascript Photo Album!</font>
</td></tr>
<tr align=center><td height=30>
<input type=button value="previous" onClick="PreviousSuzyPic();" style="font:8pt verdana,helvetica,arial; text-align:center">
<input type=button value="next" onClick="NextSuzyPic();" style="font:8pt verdana,helvetica,arial; text-align:center">
<input type=button value="random" onClick="RandomSuzyPic();" style="font:8pt verdana,helvetica,arial">
</td></tr>
<tr align=center><td height=30>
<script language=javascript>
<!--
  TotalImages = PicVar;
    document.write("<SELECT style='font:8pt verdana' name='SuzyDropdown' onChange='ShowSuzyPic(SuzyForm.SuzyDropdown.options.selectedIndex);'>");
  for (loop=0; loop < TotalImages; loop++)
  {
  document.write("<option value=" + PicVal[loop] + ">" + TitVal[loop] + "</option>");
  }
-->
</script>
</td></tr>
<tr align=center><td>
<IMG border=1 id="suzypic" NAME="suzypic" SRC="http://www.js-examples.com/images/red_ball0.gif" height=100 width=100>
</td></tr>
<tr align=center><td height=30>
<input type=text name="SuzyDate" value="4/23/2001" size=18 onFocus="this.blur()" 
style="font:8pt verdana,helvetica,arial; text-align:center">
</td></tr>
<tr align=center><td height=90>
<TEXTAREA name="SuzyText"  ROWS=5 COLS=45 WRAP=PHYSICAL onFocus="this.blur()" 
style="font:8pt verdana,helvetica,arial; text-align:center">
Select a picture name from the dropdown list to see a picture and description.
</TEXTAREA>
</td></tr></table>
</FORM>
<SCRIPT Language="Javascript">
document.write("This album currently has  " + PicVar + "  photos and was last modified on  " + document.lastModified +".");
</script> 

Times Viewed: 1

Leave a Reply

Your email address will not be published. Required fields are marked *