zoukankan      html  css  js  c++  java
  • jQuery中animate的应用(图片自动移动)

    图片按照数字的顺序移动

    <head>
        <title></title>
        <style type="text/css">
        img
        {
            position:absolute;
            top:13px;
            left:13px;
            100px;
            height:100px;
            }
            td
            {
                100px;
                height:100px;
                border:1px solid red;
                }
        </style>
        <script src="jquery-1.9.1.js" type="text/javascript"></script>
        <script type="text/javascript">
            $(function () {
                $('img').click(function () {
                    $(this).animate({ left: '+=104px' }, 2000).animate({ left: '+=104px' }, 2000).animate({ top: '+=104px' }, 2000).animate({ left: '-=104px' }, 2000).animate({ left: '-=104px' }, 2000).animate({ top: '+=104px' }, 2000).animate({ left: '+=104px' }, 2000).animate({ left: '+=104px' }, 2000);
                })
            })
        </script>
    </head>
    <body>
        <table style="border:1px solid red;">
            <tr>
                <td><img alt="" src="images/1.jpg" />1</td><td>2</td><td>3</td>
            </tr>
            <tr>
                <td>6</td><td>5</td><td>4</td>
            </tr>
            <tr>
                <td>7</td><td>8</td><td>9</td>
            </tr>
        </table>
    </body>

  • 相关阅读:
    mysql,apache,php的关系
    简析 Tomcat 、Nginx 与 Apache 的区别
    Linux中涉及到环境变量的文件
    如何在Linux启动的时候执行一个命令
    sed的额外用法(网摘)
    shell脚本执行方式
    在rhel7上搭建centos7的yum源
    MYSQL三种安装方式--二进制包安装
    ssh连接不上排查方法总结
    MySQL启动很慢的原因
  • 原文地址:https://www.cnblogs.com/duanlinlin/p/3065159.html
Copyright © 2011-2022 走看看