By christopherareed on

Here's our site, www.hotautoweb.com, and I'm trying to come up with a way to show more thumbnails on a half second delay when they mouse over a certain car. So there is the initial image, when the cursor is on the image, it changes through a pre-determined list of images to display which I've already got all figured out and set up. It is a static, identical list across each car listing so none of that is the problem.

The problem is I've spent the entire day reading through at least a good 50+ pages of google/drupal results from multiple searches regarding any sort of java syntax that can accomplish this. There are things that come close, that have the general aspect of the idea in the same ballpark but none that do just that, which really surprised me.

Seems this may be a useful place to start.

<HTML>
<HEAD>

<SCRIPT LANGUAGE="JavaScript">

var timeDelay = 0.5;
var Pix = new Array
	("images/1.gif"
	,"images/2.gif"
	,"images/3.gif"
	);
var howMany = Pix.length;
timeDelay *= 1000;
var PicCurrentNum = 0;
var PicCurrent = new Image();
PicCurrent.src = Pix[PicCurrentNum];

function startPix() {
	setInterval("slideshow()", timeDelay);
}

function slideshow() {
	PicCurrentNum++;
	if (PicCurrentNum == howMany) {
		PicCurrentNum = 0;
}

PicCurrent.src = Pix[PicCurrentNum];
document["ChangingPix"].src = PicCurrent.src;
}

</script>
</HEAD>

<BODY OnLoad="startPix()">

<img name="ChangingPix" src="images/1.gif">

</BODY>
</HTML>

Anyone have any know how they could contribute to this? It looks like this code could do what I want it to? The BODY OnLoad throws me off I think. How would I go about adjusting this code to work for me in Drupal?

Comments

dang.artman’s picture

dang.artman commented

I am no expert, but I would think you should be able to use the "a.hover" state in your CSS to get the images to change. You will have to find a variable that grabs another image cache profile for each image in that state.. Hope that helps.

christopherareed’s picture

christopherareed commented

Yes, every response helps! I've been figuring out everything entirely by myself, since I picked up Drupal for the first time like a year ago. So I'll definitely check out what you brought up!

Do you know if a.hover can display a series of images? I don't want to just play 1 additional image on hover, for my purpose I need a series of them to display in succession. Either way I'm going to go look it up here in a few minutes, thanks again.

dang.artman’s picture

dang.artman commented

Well, as far as I understand it, a.hover is a state. If you can use PHP or javascript to define the state then you could use a function to create a slide show.. In theory..

christopherareed’s picture

christopherareed commented

I like where this is going. That will be useful then, I've been trying out the javascript thus far, and I'm just a bit off I think since I've never been formally taught...

christopherareed’s picture

christopherareed commented

I wish there was someone who is good with JS, that could take a look at the script up above, I think it's pretty close to being able to accomplish this...

christopherareed’s picture

christopherareed commented

Friendly bumpage

christopherareed’s picture

christopherareed commented

I've still not been able to get this just right...