SitePoint Sponsor

User Tag List

Results 1 to 2 of 2

Hybrid View

  1. #1
    SitePoint Addict Zapppa's Avatar
    Join Date
    Aug 2009
    Posts
    314
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Simple text animation with Jquery

    Hi,

    I am currently reading Sitepoint's Jquery book - Novice to Ninja, very enjoyable so far.

    I am just a little stuck on chapter 3 on the animations part.

    I am trying to animate text and I wrote this code:

    Code:
    <script type="text/javascript"> 
    
    $(document).ready(function() {
    $('p').animate({height: '+=40px'}, 2000, 'easeOutBounce');
    });		
    </script>
    Any ideas as to why doesn't respond?

    I have included the library and UI in my head.

  2. #2
    Unobtrusively zen silver trophybronze trophy
    paul_wilkins's Avatar
    Join Date
    Jan 2007
    Location
    Christchurch, New Zealand
    Posts
    14,678
    Mentioned
    99 Post(s)
    Tagged
    4 Thread(s)
    Quote Originally Posted by Zapppa View Post
    I have included the library and UI in my head.
    I don't know why it doesn't work for you, because a simple test using your code works for me.

    Code:
    <html>
    <head>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
    <script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.18/jquery-ui.min.js"></script>
    </head>
    <body>
    <p>Sample text</p>
    <p>More text</p>
    <script type="text/javascript"> 
    $(document).ready(function() {
    $('p').animate({height: '+=40px'}, 2000, 'easeOutBounce');
    });
    </script>
    </body>
    </html>
    Programming Group Advisor
    Reference: JavaScript, Quirksmode Validate: HTML Validation, JSLint
    Car is to Carpet as Java is to JavaScript


Bookmarks

Posting Permissions

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