Thanks for the insight Johan! When I implemented that though, it just
added the hover cross fade to the other div as well. I am looking for
a way to make the 2nd div JUST trigger the first. I was looking at the
page you linked to and I am messing around with something like the
following... although I can't get it to work. Any thoughts?

$(document).ready(function () {
        $('div.tv, div.desk, div.phone').hover(function () {
                //hover in
                var div = $('> div', this);

                if (div.is(':animated')) {
                        div.stop().fadeTo(500, 1);
                } else {
                        div.fadeIn(250);
                }
        }, function () {
                // hover out
                var div = $('> div', this);
                if (div.is(':animated')) {
                        div.stop().fadeTo(1000, 0);
                } else {
                        div.fadeOut(1000);
                }
        });
          $("div.tvbutton").hover(function () {
          $("div.tv").trigger('hover');

    });



On Jan 5, 4:33 pm, Johan Borestad <johan.bores...@gmail.com> wrote:
> Hi!
> There are a number of nice implementations you could use for this.
> Example the jQuery trigger.http://docs.jquery.com/Events/trigger
> But for now, the simpliest solution is just to add another selector
> like this
>
> $('div.example, div.tv').hover( .....
>
> / Johan
>
> On Jan 5, 8:33 pm, Jordan <jscottphil...@gmail.com> wrote:
>
> > I recently implemented the Image Cross Fade Transition (http://
> > jqueryfordesigners.com/image-cross-fade-transition/)
>
> > It works great, and I'm hoping to add to the code to enhance the
> > functionality. Currently, if I hover over the image, it runs the cross
> > fade transition, which I would like to keep. I have another div on the
> > page that I would like to trigger the first instance when hovered over
> > as well. Is there a good way to add this?
>
> > Here's what I'm using for the first instance:
>
> > $(document).ready(function () {
> >         $('div.tv').hover(function () {
> >                 //hover in
> >                 var div = $('> div', this);
>
> >                 if (div.is(':animated')) {
> >                         div.stop().fadeTo(500, 1);
> >                 } else {
> >                         div.fadeIn(250);
> >                 }
> >         }, function () {
> >                 // hover out
> >                 var div = $('> div', this);
> >                 if (div.is(':animated')) {
> >                         div.stop().fadeTo(1000, 0);
> >                 } else {
> >                         div.fadeOut(1000);
> >                 }
> >         });

Reply via email to