PDA

View Full Version : image slideshow from my own server query



mt1000
11-23-2004, 05:57 AM
I am trying to make a page for my own use, not for the world wide web, to view about 100 images stored on my computer. Since they are different sizes I thought I'd code a slideshow webpage using this system:

http://www.dynamicdrive.com/dynamicindex14/flexislide.htm

But the image path I want to use is to my C drive. I get the page OK and the descriptive text rotates with no image showing. All the images should have a path of C:\Program Files\AnfyTeam\font1x\image.gif

Trying to fix it I removed the 'C:\', I used the other style slash '/' and I'm generally tearing out my hair. I did note the maximum width, height of my sample images. And they are .gifs not .jpgs. I'm using a PC with Windows ME. When I open My Documents and put 'C:\Program Files\AnfyTeam\font1x\image.gif' in the address bar the image I want shows up fine.

The images are font snapshots and its tedious to try and open them one by one to select them. What the heck is wrong with the path I'm using to the images, or does DHTML not work on my own computer? :eek: Other script tests always worked fine!

simonf
11-23-2004, 06:35 AM
Hi mt1000

O.K.. I take you are using frontpage or something like that. I suggest you start by making a directory called whatever. In that directory create another directory where you place you can place your pictures etc (or copies of same). In the page you create your reference the image in that directory (you will see when you are editing it, you get a long name etc etc) but when saved the htm file will only look at the directories within your root directory.

So a sample of what I mean is:

create directory: my documents/web sites/site name

create sub-directory: site name/images

place image in directory: site name/images/button.gif etc etc

Edit your page to add image and save page in your root directory i.e

my documents/web sites/site name

when saves your image sources should look like this...

<img border="0" src="images/button.gif" width="348" height="71" align="top"></td>

hope this helps, rgds,Simonf :cool:

p.s if you want me to email you a zipped sample let me know.

mt1000
11-23-2004, 02:59 PM
I'm not using frontpage. I'm writing code by hand but most of the page is Flexislide taken from Dynamic Drive. My many images are all manor of sizes and I use this because I only need the largest of the width and height numbers. It saves opening about 200 images and tediously writing down the specs.
I tried relocating the html page to the folder where the image subfolders are and designating the path as 'subfolder\image01.gif' etc. and it still shows no image. It does show a spot for an image, it does rotate the image names.

Here's the code as edited presently:
__________________________________________
<script language="JavaScript1.2">

/***********************************************
* Flexi Slideshow- Dynamic Drive (www.dynamicdrive.com)
* This notice must stay intact for use
* Visit http://www.dynamicdrive.com/ for full source code
***********************************************/

var variableslide=new Array()

//variableslide[x]=["path to image", "OPTIONAL link for image", "OPTIONAL text description (supports HTML tags)"]

variableslide[0]=['font1x\16x10r.gif', '', '16x10r']
variableslide[1]=['font1x\atomixr.gif', '', 'atomixr']
variableslide[2]=['font1x\aura1fntr.gif', '', 'aura1fntr']

//configure the below 3 variables to set the dimension/background color of the slideshow

var slidewidth='320px' //set to width of LARGEST image in your slideshow
var slideheight='55px' //set to height of LARGEST iamge in your slideshow, plus any text description
var slidebgcolor='#666699'

//configure the below variable to determine the delay between image rotations (in miliseconds)
var slidedelay=3000

////Do not edit pass this line////////////////

var ie=document.all
var dom=document.getElementById

for (i=0;i<variableslide.length;i++){
var cacheimage=new Image()
cacheimage.src=variableslide[i][0]
}

var currentslide=0

function rotateimages(){
contentcontainer='<center>'
if (variableslide[currentslide][1]!="")
contentcontainer+='<a href="'+variableslide[currentslide][1]+'">'
contentcontainer+='<img src="'+variableslide[currentslide][0]+'" border="0" vspace="3">'
if (variableslide[currentslide][1]!="")
contentcontainer+='</a>'
contentcontainer+='</center>'
if (variableslide[currentslide][2]!="")
contentcontainer+=variableslide[currentslide][2]

if (document.layers){
crossrotateobj.document.write(contentcontainer)
crossrotateobj.document.close()
}
else if (ie||dom)
crossrotateobj.innerHTML=contentcontainer
if (currentslide==variableslide.length-1) currentslide=0
else currentslide++
setTimeout("rotateimages()",slidedelay)
}

if (ie||dom)
document.write('<div id="slidedom" style="width:'+slidewidth+';height:'+slideheight+'; background-color:'+slidebgcolor+'"></div>')

function start_slider(){
crossrotateobj=dom? document.getElementById("slidedom") : ie? document.all.slidedom : document.slidensmain.document.slidenssub
if (document.layers)
document.slidensmain.visibility="show"
rotateimages()
}

if (ie||dom)
start_slider()
else if (document.layers)
window.onload=start_slider

</script>

<ilayer id="slidensmain" width=&{slidewidth}; height=&{slideheight}; bgColor=&{slidebgcolor}; visibility=hide><layer id="slidenssub" width=&{slidewidth}; left=0 top=0></layer></ilayer>

___________________________________________

I only edited the variables. Just 3 to start with.