PDA

View Full Version : Image slideshow with paragraph of text rather than a short caption



judeabb
07-28-2008, 05:44 PM
I'm using the Advanced Push-Button SlideShow With Captions & Cross-Fade from codelifter and get on with it fine. One of my slideshows requires a paragraph or two of text for each image rather than a caption.
I can't make this work. I presume it's because there's a limit to the maxmum caption size. However, seeing as I know NOTHING about javascript (apart from how to copy and paste it into my webpages) I have no idea how to resolve this problem.
The page I'm trying to do this on can be found here:
http://www.caseyorr.com/new/comings.html

Any help would be very much appreciated.

jscheuer1
07-28-2008, 06:22 PM
At the very least, the captions must each occupy only one line in the code or be concatenated from multiple lines. I see some other issues. Try this version:


<script>

// (C) 2003 by CodeLifter.com
// Free for all users, but leave in this header.

// ==============================
// Set the following variables...
// ==============================

// Set the slideshow speed (in milliseconds)
var SlideShowSpeed = 3000;

// Set the duration of crossfade (in seconds)
var CrossFadeDuration = 0;

var Picture = new Array(); // don't change this
var Caption = new Array(); // don't change this
var showHot = false; // don't change this

// Specify the image files...
// To add more images, just continue
// the pattern, adding to the array below.
// To use fewer images, remove lines
// starting at the end of the Picture array.
// Caution: The number of Pictures *must*
// equal the number of Captions!

Picture[1] = '../comings/giertaw.jpg';
Picture[2] = '../comings/bettan.jpg';
Picture[3] = '../comings/eileen.jpg';
Picture[4] = '../comings/zienab.jpg';



// Specify the Captions...
// To add more captions, just continue
// the pattern, adding to the array below.
// To use fewer captions, remove lines
// starting at the end of the Caption array.
// Caution: The number of Captions *must*
// equal the number of Pictures!

Caption[1] = "Following her mother and brother who now live in Newcastle, Giedre came from Lithuania to England in 1998. Giedre wanted to "+
"live in England to study language and learn about British culture. She has one daughter. "+
"Giedre stands among a cluster of silver birch trees in Gott's Park in Armley, Leeds. "+
"Because of a shallow root system, the birch would have been one of the first to "+
"re-colonise the rocky landscape when the huge glaciers of the last ice age receded. They are found throughout the whole of the Northern Hemisphere. <br>"+
"Pre-Christian Lithuanians believed that a dead person's soul left the human body and found a new home in plants, animals, "+
"or birds, but most frequently in trees. Oak trees in Lithuania have been protected by law since 1420. During the Soviet era, land "+
"reclamation programs saw farmhouses, barns, plants and trees razed throughout the countryside. All that remains of these farms is "+
"the oak trees planted along the farm "+
"borders and in recognition of family births and deaths. "+
"Across a now disappeared land bridge that once connected Britain to the rest of Europe, birch trees moved in, along with pine and oak. "+
"Deer, bears, badgers, horses, rabbits and red squirrels crossed with them.";
Caption[2] = "Bettan left her native Finland in the early seventies to hitchhike and work around Europe. She settled in "+
"England in 1976 and has lived in Armley, Leeds for 25 years. She has two children and two grandchildren all living within a mile of the house that she shares with her partner."+
"Bettan says she feels European, not British. The merging of Europe and influx of "+
"Europeans into areas like Armley allows her to feel a sense of belonging without losing her own identity. >"+
"Bettan is standing in front of a fox lair. The red fox has the widest geographical range of all carnivores, being found in "+
"almost all of the United States, Europe, North Africa, and Asia."+
"In the 17th and 18th centuries European red foxes were introduced to America by "+
"British colonists for fox hunting. This was through so-called 'Acclimatisation Societies' that sought "+
"to introduce plants and animals into the new colonies to make them feel more like home."+
"The European Reds thrived and infiltrated the American red fox population through more aggressive hunting and breeding. "+
"Traits of the European Red eventually pervaded the genepool, leaving European and American foxes now virtually identical.";
Caption[3] = "Eileen came to England in 1942 at sixteen years of age. Unable to find work in their "+
"native Ireland her brothers and father had already emigrated a few years before. She went straight into a "+
"job at the Lewis Clothing Factory in Holbeck, Leeds. The factories were always looking for girls to work; their male workforce, "+
"Eileen's brothers included, were joining the army and heading for Europe to fight the Nazis."+
"Eileen, who has seven children, fifteen grandchildren and six great grandchildren, is a devout Catholic and is photographed "+
"in Holy Family Catholic Church in Armley, Leeds. "+
"Christianity arrived in Ireland from Rome in the early- to mid-5th century AD and soon subsumed the indigenous "+
"pagan religions. Druid traditions collapsed in the face of the new religion, but also because of famine and plagues due to climate change "+
"in 535€“536 that had devastating effects worldwide."+
"Saint Patrick, the Patron Saint of Ireland, was also sixteen years of age when, at the end of the 4th century, "+
"he, like Eileen, left his homeland. At that young age he was taken prisoner from his family home in Roman Britain by a group of "+
"Irish raiders and held in Ireland as a slave for six years. After his escape he eventually returned to Ireland as a missionary. "+
"He believed that his calling was to convert the Irish to Christianity.";
Caption[4] = "Zeinab is 16 and was born in Iraq. She came to England with her mother in 2002 "+
"because of the war. She is now settled here and wants to study Media and Art at "+
"University."+
"Zeinab is photographed at West Leeds High School in Armley, Leeds. She spends a lot of her time at school "+
"and feels comfortable there in a culturally-mixed community. "+
"Zeinab, while still being a practicing Muslim, chooses not to wear the hijab anymore. She says she feels more herself without it. <br>"+
"The word 'school' comes from the Greek scholeion. The first schools were in Ancient Greece, and Plato's Academy in "+
"Athens is considered to be the first institution of higher learning in the Western World. But it was during the Islamic Golden Age (between the 8th & 13th centuries) that, through the conquest of the Roman, Persian and Greek cultures, the Islamic world became the unrivalled intellectual centre for science, philosophy, "+
"medicine and education. <br>It was this renaissance of knowledge that influenced societies on all continents, and "+
"during this time the Islamic world developed a school system and introduced the "+
"Madrassa, the first schools built independently from the Mosques and the heir to our modern concept of school.";



// =====================================
// Do not edit anything below this line!
// =====================================

var tss;
var iss;
var jss = 1;
var pss = Picture.length-1;

var preLoad = new Array();
for (iss = 1; iss < pss+1; iss++){
preLoad[iss] = new Image();
preLoad[iss].src = Picture[iss];}

function control(how){
if (showHot){
if (how=="H") jss = 1;
if (how=="F") jss = jss + 1;
if (how=="B") jss = jss - 1;
if (jss > (pss)) jss=1;
if (jss < 1) jss = pss;
if (document.all){
document.images.PictureBox.style.filter="blendTrans(duration=2)";
document.images.PictureBox.style.filter="blendTrans(duration=CrossFadeDuration)";
document.images.PictureBox.filters.blendTrans.Apply();}
document.images.PictureBox.src = preLoad[jss].src;
if (document.getElementById) document.getElementById("CaptionBox").innerHTML= Caption[jss];
if (document.all) document.images.PictureBox.filters.blendTrans.Play();
}}

</script>

Add to your body tag:


<body bgcolor="#7c98ae" onload="showHot=true;">

And, make your control links like so:


<td width="183" height="30">
<div align="center">
<a class=Controls href="#" onClick="control('B');return false;"><img src="images/arrowlft.gif" alt="" height="38" width="77" border="0" /></a></div>
</td>

<td width="183" height="30"></td>
<td width="183" height="30">
<div align="center">
<a class=Controls href="#" onClick="control('F');return false;"><img src="images/arrowrt.gif" alt="" height="38" width="77" border="0" /></a></div>
</td>

judeabb
07-28-2008, 06:39 PM
Absolute genius - thank you!