bordasArredondadasHtml

<html>
<head>

        <title></title>

        <script src="DD_roundies_0.0.2a-min.js"></script>
        <script src="DD_roundies_0.0.2a.js"></script>
        <script>
            DD_roundies.addRule('a.big_link', '20px', true);
        </script>

        <style type="text/css">
            body{background-color:#CCC;}
            a.big_link {position:relative; zoom:1; float:left; margin:8px 5px 0 0; padding:50px; border:0px solid #000; color:#FFF; background:none;}
            a.png_bg {background-position:left top; background-repeat:no-repeat;}
            a.png_bg:hover {background-color:#0F0; color:#FFF;}
</style>
    </head>
    <body>

                  <script>
                        var d = 0;
                        var c = 0;
                        var upOrDown = true;
                        var setBorder = function() {
                            var obj = this;
                            var windDown = setInterval(function() {
                                d += upOrDown ? 1 : (-1);
                                if (d >= 0 && d <= 10) {
                                    obj.style.borderWidth = d + 'px';
                                    c = d%11;
                                    if (c == 10) {
                                        c = 'A';
                                    }
                                    c = c.toString();
                                    obj.style.marginLeft = d + 'px';
                                    obj.style.marginRight = d + 'px';
                                    obj.style.backgroundColor = '#' + c + c + c;
                                    obj.style.fontSize = (100 + (d*5)) + '%';
                                }
                                else {
                                    upOrDown = !upOrDown;
                                    clearInterval(windDown);
                                }
                            }, 10);
                        };
                        var morph = DD.dom.id('morph');
                        DD.event.add(morph, 'click', function() {
                            setBorder.call(morph);
                        });
                    </script>

                    <a href="#" class="big_link png_bg">Pagina</a>
                    <a href="#" class="big_link png_bg">Pagina 2</a>
    </body>
</html>