Question

我想为该三角形设置动画（我的意思是为它的缩放设置动画）。我还希望这个三角形可以缩放，直到它适合浏览器窗口。

有什么想法吗？

如果我的英语不好，我很抱歉。

这是我的代码：

  <style type="text/css">
    body{
        margin:0px;
        padding:0px;
        overflow:hidden;
    }
    #animated_triangle {
        float: right;
        width: 0; 
        height: 0;
        border-top: 100px solid #666; 
        border-left: 100px solid transparent; 
    }
    </style>
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
    <script type="text/javascript">
    function triangle_animation()
    {
    document.getElementById("animated_triangle").style.border="solid #666 1024px";
    }
    $(".animated_triangle").click(function() {
        $(".animated_triangle").animate({"height" : "350"}, 500);
     });
    </script>
    </head>
    <body>
    <div id="animated_triangle" onclick="triangle_animation()">

    </div>

三角缩放的动画，缩放后适合窗口

0 个答案: