专注收集记录技术开发学习笔记、技术难点、解决方案
网站信息搜索 >> 请输入关键词:
您当前的位置: 首页 > JavaScript

jQuery的基础卡通片操作

发布时间:2010-05-20 14:01:29 文章来源:www.iduyao.cn 采编人员:星星草
jQuery的基础动画操作

结果:层不动
<html>
    <head>
        <title>TODO supply a title</title>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
        <meta name="viewport" content="width=device-width" />
        <style type="text/css">
            .panel{
                position:relative;
                width:200px;
                height:200px;
                border:1px solid;
                background:#96E555;
            }
            </style>
            <script type="text/javascript">
                $(".panel").click(function(){
                    $(this).animate({top:"100px",left:"500px"},1000);
                });
            </script>
    </head>
    <body>
        <div class="panel"></div>
    </body>
</html>
------解决思路----------------------
真搞不懂,这年代的人都怎么了。。。。


<html>
    <head>
        <title>TODO supply a title</title>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
        <meta name="viewport" content="width=device-width" />
        <style type="text/css">
            .panel{
                position:relative;
                width:200px;
                height:200px;
                border:1px solid;
                background:#96E555;
            }
            </style>
<script type="text/javascript" src="http://www.w3school.com.cn/jquery/jquery-1.11.1.min.js"></script>
            <script type="text/javascript">
$(document).ready(function(){
                $(".panel").click(function(){
                    $(this).animate({top:"100px",left:"500px"},1000);
                });
});
            </script>
    </head>
    <body>
        <div class="panel"></div>
    </body>
</html>

友情提示:
信息收集于互联网,如果您发现错误或造成侵权,请及时通知本站更正或删除,具体联系方式见页面底部联系我们,谢谢。

其他相似内容:

热门推荐: