PDA

View Full Version : Cmotion Image Gallery II Scroll Help



ronnie_k
12-19-2008, 12:51 AM
1) Script Title: Cmotion Image Gallery II

2) Script URL (on DD): http://www.dynamicdrive.com/dynamicindex4/cmotiongallery2.htm

3) Describe problem: I've used this code in my website, but its stopped working.
When I first used the code there were no problems, but it stopped working...?
There are 2 scrollbars that have no appeared..

http://i34.photobucket.com/albums/d134/ronnie_k/scrollbar.png

Ive tried to fiddle about with the code, but I havent got very far.

Any help is appreciated. Thanks.

jscheuer1
12-19-2008, 04:51 AM
Sounds like you've removed overflow hidden from one or more key places in the code and/or styles.

But it could be a number of other things, either alone or in combination with each other. If you want more help:

Please post a link to the page on your site that contains the problematic code so we can check it out.

ronnie_k
12-19-2008, 08:33 PM
The site is not online at the moment, but here are the sections where I have integrated the code:


<link rel="stylesheet" href="css/lightbox.css" type="text/css" media="screen" />
<script type="text/javascript" src="js/prototype.js"></script>
<script type="text/javascript" src="js/scriptaculous.js?load=effects"></script>
<script type="text/javascript" src="js/lightbox.js"></script>
<script type="text/javascript" src="motiongallery2.js">

/***********************************************
* CMotion Image Gallery II- Dynamic Drive DHTML code library (www.dynamicdrive.com)
* Visit http://www.dynamicDrive.com for source code
* Modified by jscheuer1 for vertical orientation, at http://www.dynamicDrive.com/forums
***********************************************/
</script>

<script type="text/JavaScript">


<tr>
<td height="241" colspan="6" background="images/index_13.png"><div style="overflow:hidden;">
<div id="motioncontainer" style="width:177px; height:241px; overflow:hidden; position: relative;">
<div id="motiongallery" style="position:absolute; left:0; top:0; overflow: scroll; height: 241px; width: 177px;">

<!--Gallery Contents below-->

<a href="images/freshtodeathlarge.png" rel="lightbox" title="Fresh To Death"><img src="images/thumbnailfreshtodeath.png" width="169" height="84" border=1></a><br />
<a href="images/illtypeflow.png" rel="lightbox" title="Ill Type Flow"><img src="images/thumbnaililltypeflow.png" width="169" height="84" border=1></a><br />
<a href="images/jasinvite.png" rel="lightbox[homepage]" title="Birthday Invitation"><img src="images/thumbnail.png" border=1></a><br />
<a href="#"><img src="images/thumbnail.png" border=1></a><br />
<a href="#"><img src="images/thumbnail.png" border=1></a><br />
<a href="#"><img src="images/thumbnail.png" border=1></a><br />
<a href="#"><img src="images/thumbnail.png" border=1></a><br />
<a href="#"><img src="images/thumbnail.png" border=1></a><br />
<a href="#"><img src="images/thumbnail.png" border=1></a>

<!--End Gallery Contents-->
</div>
</div>
</div>

jscheuer1
12-19-2008, 08:38 PM
Get rid of:


overflow: scroll; height: 241px; width: 177px;

There could also be other problems.

ronnie_k
12-19-2008, 10:32 PM
Thanks for the help, but unfortunately it hasn't worked.

jscheuer1
12-20-2008, 02:18 AM
Well, that needed to be removed, and - as I said, there could also be other problems. For one, your published code doesn't make clear what version of Lightbox you are using. It is possible that there is a conflict between Cmotion II and the version of Lightbox you have.

The bottom line though is that one can read over code all one wants, but to really troubleshoot something, one often must see it in action. If you could make up a .zip archive of all of the files required to demonstrate this issue and attach that to your post, then I could use that for troubleshooting.

However, if you have some access to some space on the web, putting up a live demo of the problem is preferred.

ronnie_k
12-20-2008, 04:52 PM
I haven't finished the entire site yet, but I could upload all the coding for the page?

I'm using Lightbox version 2.03

Thanks

jscheuer1
12-20-2008, 04:58 PM
Lightbox 2.03 shouldn't conflict, but I cannot be certain. In itself, it would not. But its resource files (prototype, scriptaculous, etc.) might.

Sure, go ahead and put up a demo of the problem and post a link to it. It doesn't have to be linked to or from your other pages, and the site certainly doesn't have to be finished. It just has to show the problem.

ronnie_k
12-20-2008, 05:20 PM
http://82.110.149.89/lockers/lang/khunkhuh899/index.html

There is a version with only the index page, (I havent uploaded any images, so it will not show anything) however, I have added the javascript and css.

jscheuer1
12-20-2008, 05:47 PM
Doesn't really demonstrate the scrollbar problem, guess we fixed that. There is a conflict and another problem. The conflict is with the onload event of the preload script in the body tag. To fix that, add the Cmotion II onload event to it, like so:


<body leftmargin="0" topmargin="0" marginwidth="0" marginheight="0" onLoad="fillup();MM_preloadImages('images/index_ . . .

When doing that, it should be removed from the Cmotion script. Get rid of it (highlighted), or comment (red) it out as shown:


. . . ndow.opera){
cross_scroll.style.top=menu_height-actualheight+'px'
setTimeout('cross_scroll.style.top=0', 10)
}
loadedyes=1
if (endofgallerymsg!=""){
creatediv()
positiondiv()
}
}
//window.onload=fillup

The other problem that I see is that the page doesn't show up at all in IE or Opera. This is because you have an unclosed comment tag in your stylesheet:


<style type="text/css">
<!--
body {
background-image: url(images/damaskbg.png);
background-color: #FFFFFF;
}

body,td,th {
font-family: Trebuchet MS;
color: #3A3A3A;
font-size: 10px;
}
.style1 {font-size: 10px}
.style4 {font-weight: bold; color: #81D8D0;}
.style6 {font-size: 9px}
</style>

May as well just get rid of it, but you could choose to close it at the end of the sheet if you like:


<style type="text/css">
<!--
body {
background-image: url(images/damaskbg.png);
background-color: #FFFFFF;
}

body,td,th {
font-family: Trebuchet MS;
color: #3A3A3A;
font-size: 10px;
}
.style1 {font-size: 10px}
.style4 {font-weight: bold; color: #81D8D0;}
.style6 {font-size: 9px}
-->
</style>

There could still also be other problems, as without the images, or the lightbox scripts (they are not really there, just mentioned in the head of the page), this isn't a fair demonstration of the full code of the page. But, once again, at least this much must be taken care of.

I was able to get the "images" to scroll in FF (which ignored the problem with the open comment) simply by activating the fillup() function, so that's a good sign. Still, to be sure this will work with Lightbox and anything else that might be missing, I'd want a complete demo.

Of course, this may not be necessary if the above two things take care of it for you.

ronnie_k
12-20-2008, 05:59 PM
Yes!

Thank you for your help!

This has helped a lot, I will post a link to the site when it has been 100% finished.

But thanks a lot for your time and effort.