mattclegg / jquerycurvycorners

Automatically exported from code.google.com/p/jquerycurvycorners
0 stars 0 forks source link

2.1.1 - Animate a cornered div #21

Open GoogleCodeExporter opened 9 years ago

GoogleCodeExporter commented 9 years ago
What steps will reproduce the problem?
1. Cornered div
2. $('div').animate();

What is the expected output? What do you see instead?
Div to animate on animate(). Nothing happens.

What version of the product are you using? On what operating system?
2.1.1 - Windows 7, IE8

Please provide any additional information below.
<!doctype html>
<html lang="en">
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
        <meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7" />
        <title>Corner Test</title>
        <script 
src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
        <script src="js/jquery.curvycorners.source.js"></script>
        <style type="text/css">
            html, body {
                height: 100%;
            }

            body {
                background: #fff url(images/bgGradient.jpg) repeat-x;
            }

            div.round {
                width: 500px;
                height: 500px;
                background-color:#aaa;
            }

            h1 {
                padding: 10px;
            }
        </style>
        <script type="text/javascript">
            $(function() {
                $('.round').corner({
                    tl: { radius: 20 },
                    tr: { radius: 20 },
                    bl: { radius: 20 },
                    br: { radius: 20 },
                    antiAlias: true,
                    autoPad: true,
                    validTags: ["div"]
                });

                $('#enlarge').click(function() {
                    $('.round').animate({
                        height: 700
                    }, 'fast');                 
                });
                $('#reset').click(function() {
                    $('.round').animate({
                        height: 500
                    }, 'fast');
                });
            });
        </script>
    </head>

    <body>
        <div class="round">
            <h1>Simple Site</h1>
            <p><button id="enlarge">Enlarge</button>  <button 
id="reset">Reset</button></p>
        </div>
    </body>
</html>

Original issue reported on code.google.com by marcu...@gmail.com on 19 May 2010 at 3:29

GoogleCodeExporter commented 9 years ago
Issue 20 has been merged into this issue.

Original comment by jolley.s...@gmail.com on 20 May 2010 at 10:35