Cmotion Image Gallery I & II - Help

**jaylee** · 03-24-2007, 01:53 PM

1) Script Title: Cmotion Image Gallery I & II

2) Script URL (on DD):
http://www.dynamicdrive.com/dynamici...iongallery.htm
http://www.dynamicdrive.com/dynamici...ongallery2.htm

3) Describe problem:
Can I have a page with both vertical and horizonal scroll? For example, the vertical scroll with thumbnails, once clicked, the horizontal scroll with display the gallery collection for each thumbnail. I can only get one of them working at a time. Is it possible to use both of the scripts together at the same time on the same page?

I'm suspecting it's due to conflict in variable or function names. But can someone point me with some direction and tips to get this issue resolved?

Thanks.

**jscheuer1** · 03-24-2007, 02:17 PM

I think it would be rather difficult as, both scripts use many of the same variable, function and identifier names but, for different things. I could be mistaken about that, if so - simply resolving any onload conflict should take care of it for just one of each script.

However, for what you are talking about, changing the image train for an existing cmotion, horizontal or vertical, will not work unless it is the same length as the train being replaced or you also reinitialize the script with each change.

A potential problem with what you are proposing is the inevitable byte load of so many images on one page. To get around that, consider using an iframe to display the horizontal shows, each of which would be on a separate page. This would allow their images to only be loaded when their page gets loaded into the iframe. It would also allow you to use the scripts without modification as, being on separate pages, there would no longer be any conflicts.

You may also want to have a look at:

http://www.dynamicdrive.com/forums/s...ad.php?t=13302

Which can run multiple instances of the horizontal cmotion without conflicts with itself or with the vertical version but, due to the byte load issue, the iframe solution would probably be best.

Another thing that will help in any case is to make sure that all of your images are optimized so as to reduce overall byte load.

**jaylee** · 03-24-2007, 03:06 PM

Thanks John.

Using iframe would be an easier solution to achieve my desired effect, but does iframe support cross browser platform, IE, FF, and NS? I want to maximize my browser compatibility.

I'll try to take a look at the OO version, it seems will do the job too. But I couldn't find the link to download the .css and .js file for this version.

**jscheuer1** · 03-24-2007, 03:59 PM

The iframe is supported in virtually all browsers that would support the scripts, certainly in all versions of the browsers you mention that also support the scripts.

Those files are here:

gallerystyle_oo.css

motiongallery_oo.js

**jaylee** · 03-25-2007, 01:45 PM

John,

I just downloaded the two files, how do I call the script from the web page?

It seems defining images within the script itself.

Thanks.

**jscheuer1** · 03-25-2007, 03:28 PM

Here is the 'view source' from the demo page (required tags, highlight blue - required code and comments, highlight red):

Code:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/1999/REC-html401-19991224/loose.dtd">
<html>
<head>
<title>OO_CMotion Image Gallery</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<link rel="stylesheet" type="text/css" href="gallerystyle_oo.css">
      
<script type="text/javascript" src="motiongallery_oo.js">

/***********************************************
* OO_CMotion Image Gallery- © Dynamic Drive DHTML code library (www.dynamicdrive.com)
* Visit http://www.dynamicDrive.com for source code
* This copyright notice must stay intact for legal use
* Modified for autowidth and optional starting positions in
* http://www.dynamicdrive.com/forums/showthread.php?t=11839 by jschuer1 8/5/06
* Object Oriented update 9/19/06
***********************************************/

</script>
</head>
<body>
<script type="text/javascript">
/////////////////////////////////////////////////////////////////////////////////////////
/*                              Parameter Definitions:
/////////////////////////////////////////////////////////////////////////////////////////
* gallery_array_name - name of the array of the gallery's img train (object name, ex: gallery2)
* rest_area_size - size of the neutral area in the center of the gallery in pixels (integer, ex: 6)
* maxspeed - top speed of the gallery (integer)
* maxwidth - maximum width of the gallery in pixels (integer) must be less than the width of the image train
* startposition - 1 for left start, 0 for right, 2 for center (integer)
* width - width of the gallery in pixels(integer) or percent ('string' with % sign, ex: '75%')
* height - height of the gallery in pixels (integer)
* optional_centering - use [, 'c'] for centering, skip this parameter for no centering ('string')
*****************************************************************************************/

//new cmotiongallery(gallery_array_name, rest_area_size, maxspeed, maxwidth, startposition, width , height, optional_centering)
new cmotiongallery(gallery, 6, 7, 1000, 2, '50%', 225, 'c')
</script><br>&nbsp;
<script type="text/javascript">
new cmotiongallery(gallery2, 6, 7, 1000, 1, 500, 225)
</script>
</body>
</html>

Here's the link to that page:

http://home.comcast.net/~jscheuer1/s...cmotion_oo.htm

Thread: Cmotion Image Gallery I & II - Help

Thread Tools

Search Thread

Cmotion Image Gallery I & II - Help

Bookmarks

Bookmarks

Posting Permissions