simple lightbox tweak

[Irishcash33]

Hi,
I assume this is simple for a js coder. In lightbox, you click the thumbnail to activate the effect..
I want to activate it by rollover not click.
Is this easy?
Thanks

[rangana]

Normally, change the onclick event to onmouseover.

If the lightbox you have uses jquery, you can change the click() function to hover(onmouseoverFUNC(),onmouseoutFUNC()).

If nothing works, please provide a link to the page's demo to where you got the lightbox.

[Irishcash33]

THanks.
I searched the js docs and didn't find any onclick or click() that made sense to change.

Here is the site
I want the shirts to be onrollover not click to get the lightbox...

Thanks

[rangana]

I'm sorry, but this goes out of my wits. It uses scriptaculous and prototype.

[jscheuer1]

That could be done, but first - if you want to link to the caption in the lightbox, (and for other bugs fixes and enhancements) - if you are going to use Lightbox 2.04 (which I see you currently are), you should use my 2.04a version:

http://home.comcast.net/~jscheuer1/s...js/lightbox.js

introduced here:

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

Lightbox 2.04 is a bit of a departure from earlier versions, and although I felt it needed some work (hence my 2.04a version), I was very impressed at how it initialized the links. Instead of as in all previous versions (and as far as I know all imitators) where each link is altered onload, instead of that, an event for the page is set up that listens for clicks and then determines if a lightbox link was clicked or not. This has a great advantage in situations where content is added to the page after it has loaded.

Anyways, here is where that happens (in both my version and the original 2.04 version):

    updateImageList: function() {   
        this.updateImageList = Prototype.emptyFunction;

        document.observe('click', (function(event){
            var target = event.findElement('a[rel^=lightbox]') || event.findElement('area[rel^=lightbox]');
            if (target) {
                event.stop();
                this.start(target);
            }
        }).bind(this));
    },

However, I just tried this:

    updateImageList: function() {   
        this.updateImageList = Prototype.emptyFunction;

        document.observe('mouseover', (function(event){
            var target = event.findElement('a[rel^=lightbox]') || event.findElement('area[rel^=lightbox]');
            if (target) {
                event.stop();
                this.start(target);
            }
        }).bind(this));
    },

And though it worked, it made the page I was using it on at least less user friendly. You have to consider that the movement of the mouse is a less specific user action than a click, one that may be much more casually undertaken, without intent, and that covers a much larger area.