Help needed please with DHTML Book Slide show

Galaxyblue · #1 Jan 25th, 2004, 11:21

Hi Guys,

Help would be greatly appreciated here. I have used a script from Dynamic Drive and as far as I am aware I have entered everything correctly.

The slideshow for the book is working when I test in the browser, but the images are not showing:

Book_Image_Sources=new Array(
"champagne_small.jpg","http://www.galaxywebdesign.co.uk",
"confetti_small.jpg","http://www.galaxywebdesign.co.uk",
"linea_small.jpg","http://www.galaxywebdesign.co.uk",
"music_small.jpg","http://www.galaxywebdesign.co.uk" // NOTE No comma after last line
);

If anyone needs to see my whole script I can email it as I have not uploaded the page to my server yet.

Thanks in advance,

GB

Rob · #2 Jan 25th, 2004, 11:25

Hi...

Welcome to the forums!!!

Can you post the complete script?

Cheers

Rob · #3 Jan 25th, 2004, 11:30

Also... some advice...

Remove these lines from your pages

Code: Select all

<meta name="Title" content="galaxy web design wedding and special occasion website design">
<meta name="Subject" content="wedding and special occasion website design">

You are spamming badly with all those meta keywords.... I would keep it to 300 characters max.

Externalise all your javascript into .js files.

The first three lines in the head section, should really be
1. <Title> Page Title <Title>
2. Meta description
3. Meta Keywords

This will just help as far as google goes.

There is no point in disabling right click....
Anyone can get round it very easily.

Galaxyblue · #4 Jan 25th, 2004, 11:41

Hi, thanks for the super fast replies!

Rob - Right click - I am so new at this websdesign malarkey that I found that script the other day and tried it out. I know people can get round it, I have in the past <g>

As for the title, what do you mean by spamming? I'm a little confused! I thought it was best to put as much info in there as poss so it gets picked up by the search engines! Please advise, your thoughts are appreciated.

Here is my script, sorry its a long one!

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>Untitled Document</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
</head>

<body onload="ImageBook()"><script type="text/javascript">

/***********************************************
* Book Flip slideshow script- © Ger Versluis 2003
* Permission granted to DynamicDrive.com to feature script
* This notice must stay intact for use
* Visit http://www.dynamicdrive.com/ for full source code
***********************************************/

/************************************************** ******
Create a div with transparent place holder in your html
<div id="Book" style="position:relative">
[img]placeholder.gif[/img]
</div>
width = 2*book image width +4 height = book image height+2

Insert onload in body tag
<body onload="ImageBook()">
************************************************** *******/

// 7 variables to control behavior
var Book_Image_Width=140;
var Book_Image_Height=225;
var Book_Border=true;
var Book_Border_Color="gray";
var Book_Speed=15;
var Book_NextPage_Delay=1500; //1 second=1000
var Book_Vertical_Turn=0;

// array to specify images and optional links. At least 4
// If Link is not needed keep it ""

Book_Image_Sources=new Array(
"champagne_small.jpg","http://www.galaxywebdesign.co.uk/champagne",
"confetti_small.jpg","http://www.galaxywebdesign.co.uk",
"linea_small.jpg","http://www.galaxywebdesign.co.uk",
"music_small.jpg","http://www.galaxywebdesign.co.uk" // NOTE No comma after last line
);

/***************** DO NOT EDIT BELOW **********************************/
var B_LI,B_MI,B_RI,B_TI,B_Angle=0,B_CrImg=6,B_MaxW,B_D irection=1;
var B_MSz,B_Stppd=false;B_Pre_Img=new Array(Book_Image_Sources.length);

function ImageBook(){
if(document.getElementById){
for(i=0;i<Book_Image_Sources.length;i+=2){
B_Pre_Img[i]=new Image();B_Pre_Img[i].src=Book_Image_Sources[i]}
Book_Div=document.getElementById("Book");
B_LI=document.createElement("img");Book_Div.append Child(B_LI);
B_RI=document.createElement("img");Book_Div.append Child(B_RI);
B_MI=document.createElement("img");Book_Div.append Child(B_MI);
B_LI.style.position=B_MI.style.position=B_RI.style .position="absolute";
B_LI.style.zIndex=B_RI.style.zIndex=0;B_MI.style.z Index=1;
B_LI.style.top=(Book_Vertical_Turn?Book_Image_Heig ht+1:0)+"px";
B_LI.style.left=0+"px";
B_MI.style.top=0+"px";
B_MI.style.left=(Book_Vertical_Turn?0:Book_Image_W idth+1)+"px";
B_RI.style.top=0+"px";
B_RI.style.left=(Book_Vertical_Turn?0:Book_Image_W idth+1)+"px";
B_LI.style.height=Book_Image_Height+"px";
B_MI.style.height=Book_Image_Height+"px";
B_RI.style.height=Book_Image_Height+"px";
B_LI.style.width=Book_Image_Width+"px";
B_MI.style.width=Book_Image_Width+"px";
B_RI.style.width=Book_Image_Width+"px";
if(Book_Border){
B_LI.style.borderStyle=B_MI.style.borderStyle=B_RI .style.borderStyle="solid";
B_LI.style.borderWidth=1+"px";
B_MI.style.borderWidth=1+"px";
B_RI.style.borderWidth=1+"px";
B_LI.style.borderColor=B_MI.style.borderColor=B_RI .style.borderColor=Book_Border_Color}
B_LI.src=B_Pre_Img[0].src;
B_LI.lnk=Book_Image_Sources[1];
B_MI.src=B_Pre_Img[2].src;
B_MI.lnk=Book_Image_Sources[3];
B_RI.src=B_Pre_Img[4].src;
B_RI.lnk=Book_Image_Sources[5];
B_LI.onclick=B_MI.onclick=B_RI.onclick=B_LdLnk;
B_LI.onmouseover=B_MI.onmouseover=B_RI.onmouseover =B_Stp;
B_LI.onmouseout=B_MI.onmouseout=B_RI.onmouseout=B_ Rstrt;
BookImages()}}

function BookImages(){
if(!B_Stppd){
if(Book_Vertical_Turn){
B_MSz=Math.abs(Math.round(Math.cos(B_Angle)*Book_I mage_Height));
MidOffset=!B_Direction?Book_Image_Height+1:Book_Im age_Height-B_MSz;
B_MI.style.top=MidOffset+"px";
B_MI.style.height=B_MSz+"px"}
else{ B_MSz=Math.abs(Math.round(Math.cos(B_Angle)*Book_I mage_Width));
MidOffset=B_Direction?Book_Image_Width+1:Book_Imag e_Width-B_MSz;
B_MI.style.left=MidOffset+"px";
B_MI.style.width=B_MSz+"px"}
B_Angle+=Book_Speed/720*Math.PI;
if(B_Angle>=Math.PI/2&&B_Direction){
B_Direction=0;
if(B_CrImg==Book_Image_Sources.length)B_CrImg=0;
B_MI.src=B_Pre_Img[B_CrImg].src;
B_MI.lnk=Book_Image_Sources[B_CrImg+1];
B_CrImg+=2}
if(B_Angle>=Math.PI){
B_Direction=1;
B_TI=B_LI;
B_LI=B_MI;
B_MI=B_TI;
if(Book_Vertical_Turn)B_MI.style.top=0+"px";
else B_MI.style.left=Book_Image_Width+1+"px";
B_MI.src=B_RI.src;
B_MI.lnk=B_RI.lnk;

setTimeout("Book_Next_Delay()",Book_NextPage_Delay )}
else setTimeout("BookImages()",50)}
else setTimeout("BookImages()",50)}

function Book_Next_Delay(){
if(B_CrImg==Book_Image_Sources.length)B_CrImg=0;
B_RI.src=B_Pre_Img[B_CrImg].src;
B_RI.lnk=Book_Image_Sources[B_CrImg+1];
B_MI.style.zIndex=2;
B_LI.style.zIndex=1;
B_Angle=0;
B_CrImg+=2;
setTimeout("BookImages()",50)}

function B_LdLnk(){if(this.lnk)window.location.href=this.ln k}
function B_Stp(){B_Stppd=true;this.style.cursor=this.lnk?"p ointer":"default"}
function B_Rstrt(){B_Stppd=false}
</script>

<div id="Book" style="position:relative"> [img]placeholder.gif[/img]</div>

<font face="Arial" size="-2">Free DHTML scripts provided by
Dynamic Drive</font></p>

</body>
</html>

Webforumz Staff · #5 Jan 25th, 2004, 18:31

What Rob means by spamming is that if you use too many keywords and repeat the same ones too many times the search engines think you're trying to unfairly trick them into placing you higher on the results, and they'll penalize you or drop your site from the results all together. Check out www.spider-food.net for some good info on what to do / not do.

If you could post a link to the actual page this script is on I can figure out the problem, but for now I'm guessing your images aren't in the same folder this script is in. Trying using a full URL to the image, or changing it to the right relative URL (for example "images/champagne_small.jpg").

Galaxyblue · #6 Jan 25th, 2004, 18:59

Hey! Thanks very much for your reply. I read the spider-food article with interest.

I was vaguely aware of too many keywords is naughty, but not to that extent.

I have reduced them somewhat now

would you be so kind as to have a look and let me know if this is acceptable.

Many thanks

Sarah x

Rob · #7 Jan 25th, 2004, 20:31

Hi Sarah!

I've found a few SEO related things to comment on ,so as not to go off-topic to much in this thread, I'll continue with the Seach Engine side of things in the relevant forum.

You can find feedback regarding your site over at this thread:-
http://www.webforumz.com/topic.asp?TOPIC_ID=823

Please can we all now redirect all Search engine feedback on the other thread.

I will leave this thread free for the Javascript Issue... I agree with Catalyst. The likelyhood is that the images are not in the same directory as your script. Just follow his advice above!

Smokie · #8 Jan 26th, 2004, 09:52

try right-clicking on the image that isnt showing, viewing the path to the image might help you work out why its not showing.

Rob · #9 Jan 26th, 2004, 10:30

Yes... I could have gave that advice, but right click was disabled at the time.... you could only view the source. (In IE, anyway)

Smokie · #10 Jan 26th, 2004, 13:51

"right click was disabled at the time" ????????

benbacardi · #11 Mar 1st, 2004, 16:24

how do you get around the right click thing?

Rob · #12 Mar 1st, 2004, 16:30

easy... view the page in lynx for starters.... or mozilla or even opera... one of these will work.

There are ways of getting round it in IE, but I wont go into those as the above is gonna work.

Similar Threads
Thread	Thread Starter	Forum	Replies	Last Post
Photo slide show	jtompkins	Flash & Multimedia Forum	1	Oct 6th, 2007 00:05
Slide show/s :)	OmiE	Flash & Multimedia Forum	4	May 25th, 2007 04:55
Image slide show	peebman2000	Flash & Multimedia Forum	8	Feb 15th, 2007 18:17
iFrame as Slide Show	gribble	Web Page Design	6	Nov 17th, 2005 19:07

		Webforumz.com > Main Forums > Design Your Website > Web Page Design
Help needed please with DHTML Book Slide show