urgent help with javascript/php

stripey24 · 11-07-2008 12:10PM #1

Hi there,

Have created a database where users can add,mod and delete items with images. The images are stored in the server directory and not the database. Im trying to create an image slideshow to display on a webpage, each item would have its own individual slideshow on their individual page. I have embedded the javascript code with php in order to achieve this but it only stays on the first image. I have no real previous experience with javascript so I cant think what Im doing wrong. Here are snippets of my code

stored in <head></head>:


<SCRIPT type="text/javascript" src="slideshow.js"></SCRIPT>
					<SCRIPT type="text/javascript">
					<!--

					<?php

					echo "SLIDES = new slideshow(\"SLIDES\");";
		            if (file_exists("images/prod_images/main/$pid-2.jpg"))
					{ echo "SLIDES.add_slide(s = new slide(\'images/prod_images/main/$pid-2.jpg\'));";
					echo "s.filter = \'progid:DXImageTransform.Microsoft.Pixelate()\';"; }


					if (file_exists("images/prod_images/main/$pid-3.jpg"))
					{ echo "SLIDES.add_slide(s = new slide(\'images/prod_images/main/$pid-3.jpg\'));";
					  echo "s.filter = \'progid:DXImageTransform.Microsoft.Fade()\';"; }


					if (file_exists("images/prod_images/main/$pid-4.jpg"))
					{ echo "SLIDES.add_slide(s = new slide(\'images/prod_images/main/$pid-4.jpg\'));";
					  echo "s.filter = \'progid:DXImageTransform.Microsoft.Barn()\';"; }


					if (file_exists("images/prod_images/main/$pid-5.jpg"))
					{ echo "SLIDES.add_slide(s = new slide(\'images/prod_images/main/$pid-5.jpg\'));";
					  echo "s.filter = \'progid:DXImageTransform.Microsoft.Barn()\';"; }


					if (file_exists("images/prod_images/main/$pid-6.jpg"))
                  { echo "SLIDES.add_slide(s = new slide(\'images/prod_images/main/$pid-6.jpg\'));";
					echo "s.filter = \'progid:DXImageTransform.Microsoft.Barn()\';"; }


				 if (file_exists("images/prod_images/main/$pid-7.jpg"))
					{ echo "SLIDES.add_slide(s = new slide(\'images/prod_images/main/$pid-7.jpg\'));";
					echo "s.filter = \'progid:DXImageTransform.Microsoft.Barn()\';"; }

				 if (file_exists("images/prod_images/main/$pid-8.jpg"))
					{ echo "SLIDES.add_slide(s = new slide(\'images/prod_images/main/$pid-8.jpg\'));";
					echo "s.filter = \'progid:DXImageTransform.Microsoft.Barn()\';"; }

			 if (file_exists("images/prod_images/main/$pid-9.jpg"))
			{ echo "SLIDES.add_slide(s = new slide(\'images/prod_images/main/$pid-9.jpg\'));";
			echo "s.filter = \'progid:DXImageTransform.Microsoft.Barn()\';"; }

			 if (file_exists("images/prod_images/main/$pid-10.jpg"))
			{ echo "SLIDES.add_slide(s = new slide(\'images/prod_images/main/$pid-10.jpg\'));";
			echo "s.filter = \'progid:DXImageTransform.Microsoft.Barn()\';"; }

	?>
	</SCRIPT>

stored in body:

<body onLoad="SLIDES.play();">

					<div id="picture">
	<?php echo "<IMG name=\"SLIDESIMG\" src=\"images/prod_images/main/$pid-2.jpg\" width=\"442\" height=\"365\" border=\"0\"
					style=\"filter:progid:DXImageTransform.Microsoft.Fade()\" alt=\"Slideshow image\">"; ?>

					<SCRIPT type="text/javascript">
					<!--

					if (document.images) {

					SLIDES.image = document.images.SLIDESIMG;

					// Create a function to ramp up the image opacity in Mozilla
					var fadein_opacity = 0.04;
					var fadein_img = SLIDES.image;
					function fadein(opacity) {
					  if (typeof opacity != 'undefined') { fadein_opacity = opacity; }
					  if (fadein_opacity < 0.99 && fadein_img && fadein_img.style &&
					      typeof fadein_img.style.MozOpacity != 'undefined') {

					    fadein_opacity += .05;
					    fadein_img.style.MozOpacity = fadein_opacity;
					    setTimeout("fadein()", 50);
					  }
					}

					// Tell the slideshow to call our function whenever the slide is changed
					SLIDES.post_update_hook = function() { fadein(0.04); }

					}


					//-->
					</SCRIPT>


					</div><!--  picture   -->

My PHP is also working fine, its mainly just the javascript and embedding it with php is my issue. Thanks for any help

daymobrew · 11-07-2008 12:31PM

I suggest looking at Ultimate fade-in slideshow.

I use it on Wheelworx and populate the list of images dynamically in PHP.

If you wish to continue with your code (which looks like it will only work with Internet Explorer) I suggest getting it working with a hard coded list of images, and then go to dynamic.

urgent help with javascript/php

Comments