PDA

View Full Version : Full Size Pic of Carousel Thumbnail On Same Page Help



Markxxx
02-21-2006, 06:58 AM
In reference to this carousel script

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

This script is awesome. One thing thought. When you click on an image it opens the full size pic in another window.

What I would like to do it open the full size image on the right side of the page

I have done this with javascript with stationary thumbnails but can't seem to apply it to this script

Basically what I have done is divide the page into a table. It has Two Columns and Two rows like this.


__________________________
|************|**********|
|************|**********|
|******A*****|****B*****|
|************|**********|
|************|**********|
|_____________|**********|
|************|**********|
|*****C******|**********|
|______________|_________ |
(sorry that diagrtam is so bad )


So the carousel runs in cell "A" and when the thumbnail is clicked the full sized pic appears in cell "B"

(Ideally I'd like to add a text description in cell "C" for each pic but that is another issue) :D

As I said I've done this with stationary thumnails (in what would be cell "A") using an onclick or an onmouse over, and a toggle a description.

But I couldn't get the carousel to work using the onclick or onmouseover.

Any suggestions? As always thanks in advance.

jscheuer1
02-21-2006, 11:59 AM
See this thread:

http://www.dynamicdrive.com/forums/showthread.php?t=5991

Markxxx
02-21-2006, 07:03 PM
Cool that works great with one issue.

I tried to run the page in

Firefox, Mozilla 1.7.1, Opera, Netscape And K-Meleon and it works fantastic

Here's the glitch

When I run it in IE 5.5 it doesn't work

I get an error message. In the other browsers when I point to the image on the carousel it allows me to click on it. But in IE it doesn't allow that and gives me a javascript error of this

Line:134
Char: 19
Error: Could not get the cursor property. Invalid Argument
Code: 0

When I look up in my html editor Line Number 134 is this

function C_Stp(){this.style.cursor=this.lnk?"pointer":"default";C_Stppd=true;if(this.pic){document.getElementById('picArea').src=this.pic}}

Character 19 in my editor starts at

{this.style.cursor

Character 19 being the {
In the above line

Any idea?

Strange enough this carousel effect looks a lot worse in IE than all the other browsers.

I just noticed on the example page (listed at top of thread) you get the same error message. Must be something about IE and the effect. Any workaround

Twey
02-21-2006, 07:19 PM
That's some ugly code.

function C_Stp() {
if(typeof this.style.cursor != "undefined") this.style.cursor = this.lnk ? "pointer" : "default";
C_Stppd=true;
if(this.pic) document.getElementById('picArea').src = this.pic;
}I also don't advise using what I presume is a custom attribute, "pic," to hold the large image's URI.

jscheuer1
02-21-2006, 10:29 PM
I think IE5.5 used 'hand' instead of 'pointer'. Not sure how to test out for that and get it to work if that is what the problem is. I wil look into it.

jscheuer1
02-21-2006, 10:40 PM
This may get it, works for the version II of the script:


function C_Stp(){this.style.cursor=this.lnk?document.all?"hand":"pointer":"default";C_Stppd=true;if(this.pic){document.getElementById('picArea').src=this.pic}}

It will force some other browsers to use 'hand' but, most of 'em can 'hand'le it.

Markxxx
02-22-2006, 12:08 AM
jscheuer1 that last code did it

It is working in IE now

Thanks a lot