PDA

View Full Version : CMotion Image Gallery starting position



mdempfle
04-01-2005, 08:05 AM
Hi,

I want to use the cmotion image gallery. (http://dynamicdrive.com/dynamicindex4/cmotiongallery.htm) but I would need to adjust the gallery to show a certain image in the middle of the viewarea.

e.g. I give a certain image the id="centerimage" and the script centers this image in the middle of the gallery.

Is this possible with this script? (or with minor modifications)

Thanks,
Michael

jscheuer1
04-02-2005, 08:08 AM
e.g. I give a certain image the id="centerimage" and the script centers this image in the middle of the galleryNot exactly sure what you mean by this. If you mean you want a certain image in the center of the scrolling display, just put it there in the middle of the listings in step 2. If, on the other hand, you want an image in the center that simply stays there, one way would be to absolutely position the gallery and then later in your HTML, absolutely position an image over top of it.

mdempfle
04-02-2005, 11:24 AM
Hi,

I want to center a certain image in the center of the scrolling display.

I want to use the cmotion gallery in my image gallery. I display a big image and below I want to display some thumbnails with the cmotion gallery (right now I show 5 static images). Therefore I cannot simply put the image I want to center in the middle. It depends on the big image which image in the cmotion gallery should be centered.

Can this be done easily?

Thanks,
Michael

jscheuer1
04-02-2005, 05:15 PM
Possibly, I'll have a look at the code some more but, let me get this straight first.

What you have:
The display image is above and the cmotion gallery below.
When a user clicks on a cmotion image it changes the display image.

What you want:
Same as what you have but, when a cmotion image is clicked you want it promoted to the center of the cmotion array.

Sound about right? In any case it would help if you could:
.

mdempfle
04-02-2005, 05:28 PM
Hello,

Right now I have a big image on top and 5 thumbnails below. If you cklick on another thumbnail the page is reloaded with the new image and the thumbnails are aranged that the clicked on is in the middle of the five thumbnails.

See:
http://tinywebgallery.ti.funpic.de/demo/index.php?album=Mexico+%28center%29&show=Fountain.jpg

I want to integrate your script in 3 steps.
1. If a user clicks on an image in the cmotion gallery the whole page is reloaded and the now "big" image is show and the cmotion gallery is centered to the thumbnail of the actual image (if it is the 1st image 2 blank one are inserted!).

2. I want to load dummies in the cmotion gallery where it is not visible at the moment and replace the images in the background :).

3. I want not to reload the page at all but to replace the big images like I do already in the slideshow :).

And I think the centering is the hardest part for me because I don't know the script. I think this would be a really cool thing If I get the cmotion gallery get running this way ;).

Thanks for your help,
Michael

jscheuer1
04-02-2005, 08:16 PM
2. I want to load dummies in the cmotion gallery where it is not visible at the moment and replace the images in the backgroundI don't get this, could you elaborate? Background of the page? Background of the processing? Replace with what? Is replace and load the same thing here?

Anyways, I had a look at your page, isn't Mexico beautiful? When I get a chance I will try setting it up the way I think it should be.

mdempfle
04-02-2005, 08:29 PM
Sure.

Sorry for not being precisely.

If I use the the cmotion gallery and load all images (e.g. 50) It would take a "long" time (e.g. loading 50 x 4k) before I can use the cmotion gallery.
I want to load only the 5 images which are actually visible with the real thumbnails. for all the other images I load are transparent 1x1 gif which is resized to the thumbnailsize . After the page is loaded I will load the other thumbnail images by javascript and replace the images which are the transparent 1x1 gif with the real Thumbnails (I do the same thing already in the slideshow).

Thanks for your help.

Michael

jscheuer1
04-03-2005, 04:04 AM
I've looked some more at what you have. It is close to what you say you want, only it doesn't use the cmotion script at all. For me to layout what you seem to say you want would require me to construct an all new page or all new pages. I generally don't go in for that sort of thing for free. I can't even make you an offer to do it here because that is against the rules of this forum. My suggestion, set up a demo using the cmotion script, the best you can, of what you want. Put it somewhere I can see it. Then it would be much less trouble for me to give free advice or code modifications. Oh, and lay off the PHP, do it in HTML and JavaScript if you want my help. Nothing against you or PHP, I just don't do PHP except for configuration of an existing program, not modification.

mdempfle
04-04-2005, 12:37 PM
O.k - you should'nt construct anything :) - pages or something.

The only thing I would need is to have the posililiy to center the cmotion script on
a certain image.

I have a small demo on

http://tinywebgallery.ti.funpic.de/test/motion.htm (the src of the images are still a php call but I don't have the images in the right size on the server)

If you can give me a hint how to center the gallery on e. g. the 4th thumbnail would help me a lot. I haven't take a closer look at your script (I hope I have some time tonight).
Are the some functions available where I can call and navigate to a certain position in the div?

Thanks for your help.
Michael

jscheuer1
04-04-2005, 05:24 PM
It is hard for me to believe you want your gallery like that! Sorry to be so demanding but, I am used to fixing things that are already as close as possible to what the designer wants. You have a link to DD in it and the large picture never changes, is that what you are shooting for?

mdempfle
04-05-2005, 08:06 AM
This was an example - none of the links makes sense at all. And the layout neither- I only wanted to have an option to center the cmotion gallery to one specified thumbnail

I already did the changes now to position the cmotion gallery where I want.

It works fine with this adddon.

function setPos(position) {
if (loadedyes){
cross_scroll.style.left= position + "px";
} else {
setTimeout("setPos()",position)
}
}

I only have to determine the location of the image and call this function. It would be nicer if he script would do this for me - e.g. center it to the image with the id="centerimage", but this solution is fine for me right now.

But if I include the script (your original one) into my layout (I will put an example on a testpage if its almost done) the whole script works but throws error sometimes.
I will include the script (and it will replace the big images :)) into my real layout and post you a link when it's almost done. Hopefully you can than help me o fix the remaining javascript errors.

A problem I'm running into right now is, that if I put a table around the images for nicer layouting the whole slideshow is not running smooth anymore under Firefox (still fine at IE).

/Michael

mdempfle
04-05-2005, 11:03 AM
Hi,

I found a Javascript error which is thrown if you do the following:

Open your cmotion page on dd
http://www.dynamicdrive.com/dynamicindex4/cmotiongallery.htm

open the javascript console an place the upper edge in the middle of the example cmotion gallery.
If you go from the example to the other windows you allways get the following error:

Error: b has no properties
Source File: http://www.dynamicdrive.com/dynamicindex4/motiongallery.js
Line: 115

Do you have any idea why the gallery is getting less smoth the more images are in the gallery (I'm testing with ~ 50 right now). This does only happen with firefox . IE runs excellent.

If I haven't done this before: I really like your script. Thanks for providing it.

/Michael

jscheuer1
04-05-2005, 04:04 PM
OK, these are some of the reasons I like folks to try the script out like they are really going to use it before I get too involved. Especially since I have no affiliation with DD other than posting in these forums. I'll look into the error you describe, it may be a bug, if so, I or someone will report it. As for slowing down in FF, I've noticed that with other scripts. There are memory stacks established within scripts for variables and other things like ongoing processing. These get treated differently by different browsers. The current generation of Mozilla based browsers (FF is one) seem to handle this differently than IE causing things to slow down at times. I can't be more specific or even certain this is what's happening, because I haven't looked into it further yet. This script may not be for you though. You might be better served taking what you originally had and simply refining that to require less page loads. If you need help doing that, I'd suggest starting a new thread in one of the general forums.

jscheuer1
04-05-2005, 04:27 PM
open the javascript console an place the upper edge in the middle of the example cmotion gallery.
If you go from the example to the other windows you allways get the following error:

Error: b has no properties
Source File: http://www.dynamicdrive.com/dynamic...otiongallery.js
Line: 115That is not a bug or even an error. By placing the console window like that AND moving the mouse like that, you are depriving the script of its onMouseOut event that sets b. If this were to happen in a page open in a background window, as it might, it would correct itself when that window was brought back to the foreground for use.

mdempfle
04-08-2005, 08:03 AM
Hi,

Sorry to bother you again.

I have almost implemented the scenario I want but now I'm really stuck at on point I hope you can help me.

My plan is to load only the visible images at the beginning and use a blnk image for all the others. After the page is loaded I start to replace the images with javascript.

I did an example that shows exactly my problem.
There is the big image on to that will be replaced and the cmotion gallery below with one real image and some blank ones (the ones that I want to replace!)
below you see something hat looks like a cmotion gallery. This is just a test with 2 <divs> like the cmotion gallery to have the same setup like the cmotion gallery.

If you click on an image in the cmotion gallery the 2nd image of the gallery should be replaced. Under IE this works fine. The image is replaced at all expected places. (in "real life the replace is not triggered by clicking but by a function I call in the background")
Firefox only replaces the big one and the one which is not in the cmotion gallery but not the ne in the cmotion gallery.

You can see it at:
http://tinywebgallery.ti.funpic.de/test/motion.htm

I don't know what to do anymore at this point. I hope you can give me a hit.

Thanks a lot in advance.

If I comment the line
document.getElementById("temp").innerHTML=cross_scroll.innerHTML //NEW stuff
in fillup
The images does display - but the gallery is of course not moving anymore :(

/Michael

jscheuer1
04-09-2005, 07:20 AM
Well I can give you a "hit" er hint:
I don't know what to do anymore at this point. I hope you can give me a hit. . . .

If I comment the line
document.getElementById("temp").innerHTML=cross_scroll.innerHTML //NEW stuffThat line replaces whatever is in the element with the id of temp with whatever is in the variable cross_scroll.innerHTML. So, make sure that variable contains what you want it to.

jscheuer1
04-09-2005, 07:42 AM
That hint is probably not enough. The more I look at at what you've got, the more it seems to me that you are trying too hard. If I'm right about that, it is partly my fault for not being clearer when I asked you to set up the page as close to the way you want it that you can get it. All I meant was for you to set up the ordinary Cmotion Gallery using your images in a layout that you want, including links that make the larger images appear when clicked. That's all I wanted. I would be happy to try and take it from there. What you have now is so out of whack, it will be easier to start over and just do what you should know how to do, then let me see it and I'll see if I can get the images to move about in the way you say you want them to.

mdempfle
04-11-2005, 07:40 AM
Thanks for still helping me out.

I didn't get you last sentence - should I setup another example?

If I put my problem into one sentence: " I want to replace an image inside the cmotion gallery with javascript"

When I replace the images before the script is loaded (by a loading function) I can replace the images.
After the script is loaded this does not work anymore.
you wrote in the script // new stuff - next to the "temp" layer.
Is there an older version that does not have this extra layer firefox has problems with?

Thanks,
Michael

mdempfle
04-11-2005, 07:55 AM
Hi,
Something else very interesting:

If I use the DomInspecter (in Firefox). I can navigate to the image: HTML - BODY - BOBR - (and then the 2.nd A) - IMG.
you can see as image.src 1x1.gif

after clicking on the picture (and reopening the DomInstpector) I have the changed .src at this point.

Therefore - Firefox does replace the image - but it does not redraw it !
Ths there a way to push firefox to redraw this?

Thanks,
Michael

jscheuer1
04-11-2005, 02:38 PM
I thought you put that '//NEW stuff' comment in there. Anyways, although I have been of great help (in their words, more or less) to many in these forums, I am not affiliated with Dynamic Drive. At this point, I can only imagine the reason for that comment and its associated code was to create wider compatibility/functionality.
I didn't get you last sentence - should I setup another example? Well that was my thinking, one that works even if it doesn't do all that you want it to, or at least comment where (and even better, why) your code varies from DD's code.
Therefore - Firefox does replace the image - but it does not redraw it !Generally, if an image that is being displayed gets its source changed by JavaScript, it changes. If you are not seeing this reflected in the display it probably means that the image is not being displayed to begin with (its visibility is hidden or its display is set to none, it may not be on the visible part of the page due to positioning or due to the visibility, display or position characteristics of a parent element).

mdempfle
04-11-2005, 03:24 PM
Hi,
oh - I thought this was your script.

But what I don't understand is that IE shows everything fine but Firefox doesn't.

If you don't know why this script act like this I think I will implement a workaround for firefox which is still quite userfriendly ;).
cmotion gallery has max. 20 images and an small arrow at the end to load the next 20.

Can I maybe get in touch with the developer of the script?

Thanks,
Michael

jscheuer1
04-11-2005, 05:12 PM
oh - I thought this was your script.Well, that was only the second time I mentioned having no affiliation with DD in this thread . . . Anyways, looking at the original code, it looks like it is a DD script. I guess this means it is authored and/or maintained by DD. I'd check with the admin of this forum (who is affiliated with DD) for information on its author.

mdempfle
04-12-2005, 06:52 AM
thanks