I think you just forgot the last brackets on your hover method:
$("div.tvbutton").hover(function () {
$("div.tv").trigger('hover');
}) <--- Forgotten
This could be optimized a little better by using id's, or at last
saving a a reference to the "div.tv", so that you don't have to make
search for the div every time (unless you're using ajax ofcourse), but
this should work now at last :-)
/ Johan
On Jan 6, 9:42 pm, Jordan <[email protected]> wrote:
> 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 <[email protected]> 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 <[email protected]> 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);
> > > }
> > > });