coyotegene
Technical User
Hi I'm a fairly new website designer and know how to hand code HTML/CSS and I've been messing around with js pretty recently and really wanted to include this js image slide show in my site but I'm having much difficulty figuring out why the .js file won't initialize. It just loads a blank white page with the <div> containing the back link.
I got the source files and directions on how to include in my site from here:
Here is the HTML from my page pretty much copied as instructed:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"<html xmlns=" lang="en" xml:lang="en">
<head>
<style type="text/css">
ul.fpthumbs{ /*thumbnails main UL list*/
list-style-type:none;
margin:0;
padding:0;
position:absolute;
left:100;
bottom:10px;
width:98%;
}
ul.fpthumbs li{
display:inline;
margin-right:10px; /*spacing between each thumbnail*/
}
ul.fpthumbs li img{
border:2px solid white;
background:gray;
cursor:hand;
cursor
ointer;
margin-top:5px;
width:50px;
height:50px;
}
ul.fpthumbs li img.selected{
border-color:red;
}
</style>
<script type="text/javascript" src="
<script src="fpslideshowvar.php" type="text/javascript"></script>
<script type="text/javascript" src="fpslideshow.js">
/***********************************************
* Full Screen Image Slideshow (w/ auto read images from directory)- by JavaScript Kit (* This notice must stay intact for usage
* Visit JavaScript Kit at for full source code
***********************************************/
</script>
</head>
<body>
<div style="position:absolute;z-index:1004;left:3px;top:0;background:lightyellow;padding:3px;font:bold 16px Arial"><a href="index.shtml" style="color:blue;text-decoration:none">Back To Full Screen Image Slideshow</a></div>
</body>
</html>
the source links to the scripts were changed accordingly.
fpslideshowvar.php and fpslideshow.js are located in the same folder as the .html and image files and I have the /thumbnails folder containing the images having the exact names of their counter-parts also in the same .html directory.
The demo works with their original script src= linkage but once I change to point to the files in my own directory the .php and .js won't initalize.
Is there something I'm missing about linking the .js and .php files effectivly? The site isn't live yet so i'm linking from my harddrive location. I'm figuring I need to include the <div> and <ul> elements in the body but when I look at their demo the .js generates these elements automatically. Also, I did change the size of the thumbdimensions:[30,30] from 50,50.
If anyone has any tips or let me know if my .js is handled alright so I can look for other things that might be the problem. Thank you.
I got the source files and directions on how to include in my site from here:
Here is the HTML from my page pretty much copied as instructed:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"<html xmlns=" lang="en" xml:lang="en">
<head>
<style type="text/css">
ul.fpthumbs{ /*thumbnails main UL list*/
list-style-type:none;
margin:0;
padding:0;
position:absolute;
left:100;
bottom:10px;
width:98%;
}
ul.fpthumbs li{
display:inline;
margin-right:10px; /*spacing between each thumbnail*/
}
ul.fpthumbs li img{
border:2px solid white;
background:gray;
cursor:hand;
cursor
ointer;margin-top:5px;
width:50px;
height:50px;
}
ul.fpthumbs li img.selected{
border-color:red;
}
</style>
<script type="text/javascript" src="
<script src="fpslideshowvar.php" type="text/javascript"></script>
<script type="text/javascript" src="fpslideshow.js">
/***********************************************
* Full Screen Image Slideshow (w/ auto read images from directory)- by JavaScript Kit (* This notice must stay intact for usage
* Visit JavaScript Kit at for full source code
***********************************************/
</script>
</head>
<body>
<div style="position:absolute;z-index:1004;left:3px;top:0;background:lightyellow;padding:3px;font:bold 16px Arial"><a href="index.shtml" style="color:blue;text-decoration:none">Back To Full Screen Image Slideshow</a></div>
</body>
</html>
the source links to the scripts were changed accordingly.
fpslideshowvar.php and fpslideshow.js are located in the same folder as the .html and image files and I have the /thumbnails folder containing the images having the exact names of their counter-parts also in the same .html directory.
The demo works with their original script src= linkage but once I change to point to the files in my own directory the .php and .js won't initalize.
Is there something I'm missing about linking the .js and .php files effectivly? The site isn't live yet so i'm linking from my harddrive location. I'm figuring I need to include the <div> and <ul> elements in the body but when I look at their demo the .js generates these elements automatically. Also, I did change the size of the thumbdimensions:[30,30] from 50,50.
If anyone has any tips or let me know if my .js is handled alright so I can look for other things that might be the problem. Thank you.
