Link Transition Effect When Hovering?

[DRE]

I've been up all night trying to get this to work but to of no avail. Sometimes it works but when it does other stuff screws up. Basically just trying to get links to highlight in slo-motion like so: http://themejunkies.net/forums/

 

[Shelley]

You could apply the transition effects to each class rather than apply a global setting which I assume your doing? The transition does have adverse effects on some areas such as navbar popupmenu hovers etc so I would apply them specifically to the areas you want.

 

[DRE]

You could apply the transition effects to each class rather than apply a global setting which I assume your doing? The transition does have adverse effects on some areas such as navbar popupmenu hovers etc so I would apply them specifically to the areas you want.

I just wanted the subforum titles to do it and the message title enhancement area like in your addon does.

 

[Shelley]

Not sure what you mean with the subforum titles. wouldn't applying the following in extra do it for the message titlebar?

.thread_view .titleBar h1 a:hover {
    -moz-transition: all 0.3s ease-in-out 0s;
    -o-transition: all 0.3s ease-in-out 0s;
    -webkit-transition: all 0.3s ease-in-out 0s;
    opacity: 0.5;
}

 

[DRE]

Not sure what you mean with the subforum titles. wouldn't applying the following in extra do it for the message titlebar?

.thread_view .titleBar h1 a:hover {
    -moz-transition: all 0.3s ease-in-out 0s;
    -o-transition: all 0.3s ease-in-out 0s;
    -webkit-transition: all 0.3s ease-in-out 0s;
    opacity: 0.5;
}

YEEAAAHH like that, thank you!!!

 

[Shelley]

.nodeTitle a:hover {
    -moz-transition: all 0.3s ease-in-out 0s;
    -o-transition: all 0.3s ease-in-out 0s;
    -webkit-transition: all 0.3s ease-in-out 0s;
    opacity: 0.4;
}

 

[MagnusB]

You can do the same thing with jQuery:

$(".link").hover(function(){
  $(this).animate({ opacity: '0.5'}, "slow"); // Hover effect
}, function() {
  $(this).animate({ opacity: '1'}, "slow"); // start / end 
});

You just need to change .link to the class you need to change. You can also use color, but then you need a plugin or jQuery UI.

 

[DRE]

Thank you but that didn't work! Hmm...

 

[DRE]

I've been using this btw

.forum_view .titleBar h1 a:hover {
    -moz-transition: all 0.5s ease-in-out 0s;
    -o-transition: all 0.5s ease-in-out 0s;
    -webkit-transition: all 0.5s ease-in-out 0s;
color: #3436CE;
}