Looped Cmotion gallery

[2_k]

1) Script Title: Cmotion Gallery

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

3) Describe problem: Is there any way to make the gallery looped?

[jscheuer1]

See:

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

The scroller(s) can be horizontal or vertical, mouse activated (like Cmotion) or regular scrolling marquees. They are continuous. The controls shown need not be used, or only some of them may be used. The controls used may be links or images instead of standard buttons, or a mixture of these, and be placed anywhere on the page you like. The tied in Lightbox is entirely optional.

If you are interested, download:

http://home.comcast.net/~jscheuer1/s...magemotion.zip

Play around with it. If you have any questions, feel free to ask.

[2_k]

Looks like is that what i need, thank you. But, is there any way to adjust "slider.width" in percents(%)??! Cos it's one of the main reasons for me, to use cmotion, which allowed it.

[jscheuer1]

I had designed that adaptation (% widths) to Cmotion, which was originally coded by DD. However, it's not as great an idea as you might think (or as I thought at the time). With screens getting wider and wider, there is always a chance you may run out of images.

There is however (only for horizontal displays):

http://www.dynamicdrive.com/dynamici...wler/index.htm

It can do this percent thing, and if it runs out of images, it shrinks. Buttons can be made for it, but the process is a little more complex than with the other script.

[2_k]

Yeah, this one works allmost fine for me(for now), thx, exept one thing. I use this code for hover effect for every image in gallery:

onmouseover="document.getElementById('').style.display = 'block';"
onmouseout="document.getElementById('').style.display = 'none';"

When i load the page, it works fine, but when the loop starts , this code stop works.
Can i fixed it somehow?

[jscheuer1]

That code doesn't do anything at any time.

[2_k]

This code show the div when the mouse moveover the image in gallery. And its works before loop.
Here is a full example of code:

<div class="marquee" id="mycrawler2">

<a  href="/img/"  onmouseover="document.getElementById('details').style.display = 'block';" onmouseout="document.getElementById('details').style.display = 'none';"  class="linm2" ><span class="des-menu" style=" margin-left: 0px; "><div id="details"/>texthere</span><img src="/img/1.jpg" alt="" /></a>
...

Maby any ideas, why it won't work when the gallery "scrolled over loop"?
Hope my explain understandble.

[jscheuer1]

It's invalid HTML for one, so no matter what we do it might not work. What happens (more or less) when crawler initializes is that it clones the 'train' (the stuff that loops) so that it can show part of one of these two trains, while the other one is exiting the viewing area and no longer occupies the entire viewing area.

When you clone something, if it's invalid, results may be unexpected. However, let's assume for the moment that isn't a problem. There's another probem. Now (because of the cloning, assuming the invalid div tag and other invalid code got cloned) you have two div elements with an id of "details". In javascript, when the browser looks for an element by its id, if it finds more than one, it either picks the first one on the page (most browsers), or gives up and throws an error (IE, perhaps some others).

Assuming everything survived the cloning and appears more or less as written/intended to the browser, one could do:

<a  href="/img/" onmouseover="this.getElementsByTagName('div')[0].style.display = 'block';" 
onmouseout="this.getElementsByTagName('div')[0].style.display = 'none';" 
class="linm2"><span class="des-menu" 
style=" margin-left: 0px;"><div id="details"/>texthere</span><img src="/img/1.jpg" alt="" /></a>

To make this all valid code, one could:

<a  href="/img/" onmouseover="this.getElementsByTagName('span')[1].style.display = 'block';" 
onmouseout="this.getElementsByTagName('span')[1].style.display = 'none';" 
class="linm2"><span class="des-menu" 
style="margin-left: 0px;"><span>texthere</span></span><img src="/img/1.jpg" alt=""></a>

But, in any case, clicking on the link might be an adventure.

[2_k]

Ok, thank you for reply and explain. So, want to ask one more quastion about this (code above). is this possible to make similar onmoseover effect on every image? So its work fine in that scroller with loops?
My target is: When hover over every image appears another little image with words on it(click for more details- for example).

Hope not bothered you much.=)

[jscheuer1]

No bother really. If it works for one, it will work for all. Experiment. If you want more help though for this particular issue, it would be easiest if you posted a link to the page:

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