Opacity Hover-over animation

1 posts, 0 answers
  1. Steve
    Steve avatar
    1805 posts
    Member since:
    Dec 2008

    Posted 25 Aug 2010 Link to this post


    RadControls version

    Q2 2010
    .NET version

    Visual Studio version

    programming language

    javascript, jQuery
    browser support

    all browsers supported by RadControls

    This will animate an the opacity of an image inside of the rotator.

    Change "slideRotator" to whatever the CssClass is on your Rotator item (contrains the jQuery search to that container, so you can remove it if you have multiple rotators, it's just faster with it there.).  The style is being tagged to the image to no overwrite styling on the rrItem itself.

    ///Rotator load function, to add in the opacity animation
    function onSlideShowLoad(sender, args){
        $('.rrItem img', '.slideRotator').attr('style', 'opacity: 0.4')
                $(this).stop(true, false).animate({
                    opacity: 1
                    opacity: 0.4

    ** Make sure you have jQuery loaded somewhere on your page or this will not work **
Back to Top