Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 3 of 3
  1. #1
    Regular Coder
    Join Date
    Feb 2010
    Posts
    227
    Thanks
    25
    Thanked 0 Times in 0 Posts

    Auto fade in/fade out text

    Hi, apologies if this is in the wrong section, but I was just wondering how this fade in/fade out effect was achieved, and whether it's complicated or can be done with just a few lines of css?

    The part I'm referring to is the the way the various accolades/quotes for the blog change as you watch.

    http://thisisnthappiness.com/about

    Thanks in advance.

  • #2
    New Coder
    Join Date
    Jan 2012
    Location
    Columbus, Ohio, U.S.A
    Posts
    41
    Thanks
    0
    Thanked 8 Times in 8 Posts
    yeah that's a pretty cool thing. Certainly not flash.

    When you inspect the element in chrome (or whatever browser) you get:

    Code:
    $('#portfolio').innerfade({
                                            displaystate: 1,
    			speed: 'slow',
    			timeout: 3500,
    			type: 'sequence',
    			containerheight: '40px'
    				
    			});
    So it looks like he/she is using a jQuery plugin called innerfade and then setting a fade animation on the div.

    Pretty simple and a real cool effect. Thanks for sharing!

    -Adam

  • #3
    Regular Coder
    Join Date
    Feb 2010
    Posts
    227
    Thanks
    25
    Thanked 0 Times in 0 Posts
    Thanks, Adam, but I was really looking for help on how I could achieve the same effect.


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •