[thelist] Slide show with html text

Thu Oct 16 08:58:32 CDT 2003

The text needs to be editable html text, not a graphic, so that the client
can update the quotes/testimonials that go below the photos.  Are you basing
this script on the text being a graphic?

On 10/15/03 10:33 PM, "Ron Dorman" <rwd at csi1st.net> wrote:

> Jono Young wrote:
> 
>> Ron,
>> Which part of this JS calls the new html text for each image that rotates in
>> the slideshow? Do I need to put each block of text into a hidden <div> tag
>> and assign a <div id="photo1quote"> ?
>> 
> opps! Sorry about that. One line of code wherever you want the images to
> be located:
> 
> <img src="img/slide1.jpg" width="100" height="100" alt="slideshow
> images" name="slide">
> 
> Adjust height and width to fit your needs. For your text, add it to the
> bottom/top of each image (make it a part of the image so it appears to
> rotate with the image), or place another container (maybe a read only
> text area?) below the image and add code to the script to change the
> container contents with the images. Could do it with hidden divs if your
> wanted to, but why add code if you don't need to?
> 
> Hope this helps. As mentioned before, it is not tested and if is "off
> the cuff".
> 
> Ron D.
> 
>> 
>> On 10/15/03 1:53 PM, "Ron Dorman" <rwd at csi1st.net> wrote:
>> 
>>  
>> 
>>> Jono Young wrote:
>>> 
>>>    
>>> 
>>>> OK, so this type of coding could not be applied to the example I provided
>>>> <http://www.snyderhomesusa.com/>, in order to have JUST the images and text
>>>> below the images refresh, leaving the rest of the pages content alone?
>>>> 
>>>>      
>>>> 
>>> Try something like this:
>>> 
>>> <script language="JavaScript" type="text/JavaScript">
>>> var image1=new Image(); image1.src="img/slide1.jpg";
>>> var image2=new Image(); image2.src="img/slide2.jpg";
>>> var image3=new Image(); image3.src="img/slide3.jpg";
>>> var image4=new Image(); image4.src="img/slide4.jpg";
>>> var step=1;
>>> function slideshow() {
>>> if (!document.images) {
>>> return;
>>> }
>>> document.images.slide.src=eval("image"+step+".src");
>>> if (step<4) {
>>> step++;
>>> } else {
>>> step=1;
>>> }
>>> setTimeout("slideit()",9000)
>>> }
>>> slideshow();
>>> </script>
>>> 
>>> <body onload="slideshow();">
>>> 
>>> 
>>> Haven't tested it myself, but is pretty straight forward and should work.
>>> 
>>> Ron D.
>>>    
>>> 
>> 
>>  
>> 

-- 
Jono Young
Designer/Illustrator
Brook Group, LTD
8231 Main Street
Ellicott City, MD 21043
T: 410-465-7805 xt: 16
<http://www.brookgroup.com/>