PDA

View Full Version : Cmotion image gallery help



Sof
07-12-2008, 10:31 AM
Hi,

I am trying to install this (http://www.dynamicdrive.com/dynamicindex4/cmotiongallery.htm) picture gallery in my site but I cannot get it to work. Can anyone help me with this. I have done what it says in the instructions.

Here's (http://www.sofielyr.com/html/esp.html) the url for the page. I want the image gallery to display in the bottom div but no luck..

Please....

Marco
07-12-2008, 03:38 PM
1.) The body onload is causing trouble (delite)
2.) Make sure that you downloaded the motiongallery.js file to your html folder?
3.) With this code inside the body the slider will work:
<div id="motioncontainer" style="position:relative;overflow:hidden;">
<div id="motiongallery" style="position:absolute;left:0;top:23px;white-space: nowrap;">
<nobr id="trueContainer">
<a href="#"><img src="../imggallery/g1.jpg"></a><a href="#"><img src="../imggallery/g2.jpg"></a><a href="#"><img src="../imggallery/g3.jpg"></a><a href="#"><img src="../imggallery/g4.jpg"></a><a href="#"><img src="../imggallery/g5.jpg"></a><a href="#"><img src="../imggallery/g6.jpg"></a></nobr></div></div>

Saludos de Hamburgo

Sof
07-12-2008, 04:21 PM
1.) The body onload is causing trouble (delite)
2.) Make sure that you downloaded the motiongallery.js file to your html folder?
3.) With this code inside the body the slider will work:
<div id="motioncontainer" style="position:relative;overflow:hidden;">
<div id="motiongallery" style="position:absolute;left:0;top:23px;white-space: nowrap;">
<nobr id="trueContainer">
<a href="#"><img src="../imggallery/g1.jpg"></a><a href="#"><img src="../imggallery/g2.jpg"></a><a href="#"><img src="../imggallery/g3.jpg"></a><a href="#"><img src="../imggallery/g4.jpg"></a><a href="#"><img src="../imggallery/g5.jpg"></a><a href="#"><img src="../imggallery/g6.jpg"></a></nobr></div></div>

Saludos de Hamburgo

Hi Marco,

I have done what you said there. Deleted the body on load and put your code into the div where I want the gallery to show. But it is still not working. I have put the motiongallery.js in both my scripts folder and my html folder.


<!-- Do not edit IE conditional style below -->
<!--[if gte IE 5.5]>
<style type="text/css">
#motioncontainer {
width:expression(Math.min(this.offsetWidth, maxwidth)+'px');
}
</style>
<![endif]-->
<!-- End Conditional Style -->
<script type="text/javascript" src="../scripts/motiongallery.js">

/***********************************************
* CMotion Image Gallery- Dynamic Drive DHTML code library (www.dynamicdrive.com)
* Visit http://www.dynamicDrive.com for hundreds of DHTML scripts
* This notice must stay intact for legal use
* Modified by Jscheuer1 for autowidth and optional starting positions
***********************************************/

</script>
<link href="../css/gallerystyle.css" rel="stylesheet" type="text/css" />


<div class="leftwrapper">
<div class="second2"><div id="motioncontainer" style="position:relative;overflow:hidden;">
<div id="motiongallery" style="position:absolute;left:0;top:23px;white-space: nowrap;">
<nobr id="trueContainer">
<a href="#"><img src="../imggallery/g1.jpg"></a><a href="#"><img src="../imggallery/g2.jpg"></a><a href="#"><img src="../imggallery/g3.jpg"></a><a href="#"><img src="../imggallery/g4.jpg"></a><a href="#"><img src="../imggallery/g5.jpg"></a><a href="#"><img src="../imggallery/g6.jpg"></a></nobr></div></div>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
</div>


</div>

jscheuer1
07-12-2008, 04:44 PM
You've made progress, now in you stylesheets make these changes:


.leftwrapper {
width:auto;
height:210px;
float:left;
padding-top: 10px;

}


.second2 {
float:left;
width:816px;
height:210px;
border: thin none #FFFFCC;
margin-left: 20px;
margin-right: 10px;
background-color: #FFFFCC;
}


#motioncontainer {
height: 210px;
width: auto;
}

Marco
07-12-2008, 04:50 PM
Sent a ZIP-File to your website E-mail address.
Hope this will help

Marco

Sof
07-12-2008, 04:53 PM
Alrighty!

Now it is working! Thank you very much! And thanks for a good script (youre the one who made it arent you) Why is the hight of so much importance?

Marco
07-12-2008, 07:28 PM
We have to thank John (CMotion Image Gallery by jscheuer1) for this nice script!
John, if you read this - could you please take a look at a new thread which I posted this morning in thr Dynamic Drive script help section, title:
Swiss Army Slideshow and CMotion Gallery in combination.
Maybe you have an idea how this could work.
Im going to upload a test version with a single swiss-army slideshow on my website and will post the link in addition to my thread.

Thank you!

jscheuer1
07-13-2008, 03:22 AM
Alrighty!

Now it is working! Thank you very much! And thanks for a good script (youre the one who made it arent you) Why is the hight of so much importance?

ddadmin originally coded this script. I just updated it for a few improvements as noted on the demo page.

To answer your question about the height you need to understand that there is no height unless one is specified for a container that holds absolutely positioned elements. The #motioncontainer division is such a container. Just giving it the height of your images (which are themselves in an absolutely positioned child of the #motioncontainer) allows them to be seen. The other height specifications were merely to make the gallery fit well into the rest of your layout. Had those other heights not been specified, there would have been extra white space and/or extra unfilled background space in the layout that I didn't believe you intended.

Sof
07-13-2008, 02:55 PM
Thanks for that reply John, I am constantly learning :)!

This is probably a HTML question but I want to make popups for the gallery but I want them with at set hight and width. Do you know how to make that happen....

I have managed to make the popup by using
<a href="javascript:enlargeimage('elpiano.html')"> But the popup remains rezizable, and I don't want that..

Marco
07-13-2008, 03:20 PM
Hello again,
Eric Kings Popup Window Generator on Dynamic Drive will work fine in combination with Cmotion.
http://www.dynamicdrive.com/dynamicindex8/popwin.htm
Description: Use Eric's Popup window Generator to easily add popup windows to your site! The windows are activated by clicking on a link, and can be fine tuned in every aspect, such as dimensions, scrollbars, toolbar etc. Awesome tool.

saludos,
Marco

jscheuer1
07-13-2008, 04:18 PM
Thanks for that reply John, I am constantly learning :)!

This is probably a HTML question but I want to make popups for the gallery but I want them with at set hight and width. Do you know how to make that happen....

I have managed to make the popup by using
<a href="javascript:enlargeimage('elpiano.html')"> But the popup remains rezizable, and I don't want that..

Removing the resizable property from a pop up is an accessibility issue. As a result, some browsers will simply not allow it no matter what you do.

With that in mind, you can edit this line to:


var winattributes="width="+actualWidth+",height="+actualHeight+",resizable=0"

And those browsers that will allow it will produce a pop up that isn't resizable. But this isn't as good an idea as you might think. In 99% of cases, the end user will only even attempt to resize the pop up if there are problems in viewing its content. In a case like that, you would want them to be able to do so.