数字图片jQuery中的animate的应用(图片的自动移动)

查了好多资料,发现还是不全,干脆自己整理吧,至少保证在我的做法正确的,以免误导读者,也是给自己做个记录吧!

    数字和图片

    图片按照数字的次序动移

    

    <head>

    <title></title>

    <style type="text/css">

    img

    {

        position:absolute;

        top:13px;

        left:13px;

        width:100px;

        height:100px;

        }

        td

        {

            width: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>

文章结束给大家分享下程序员的一些笑话语录: 有一天,一个男人穿越森林的时候,听到一个细微的声音叫住他。他低头一看,是一只青蛙。
“如果你亲我一下,我会变成一个美丽的公主哦。”男人一言不发,把青蛙捡起来,放入口袋。
“如果你亲我一下,我会变成一个美丽的公主哦。而且,我会告诉我遇到的每一个人,你是多么聪明和勇敢,你是我的英雄。”男人把青蛙拿出来,对着它微微一笑,又把它放回口袋。
“如果你亲我一下,我会变成一个美丽的公主,然后我愿意成为你的爱人一星期。”男人又把青蛙拿出来,对着它微微一笑,把它放回口袋。
“如果你亲我一下,我会变成一个美丽的公主,然后我愿意成为你的爱人一年,而且你可以对我做任何事。”再一次,男人把青蛙拿出来,对着它微微一笑,又把它放回口袋。
  最后,青蛙无力地问:“我开出了这么好的条件,为什么你还不肯吻我?”男人说:“我是一个程序员,我可没时间和什么公主鬼混。不过,拥有一个会说话的青蛙,倒是蛮酷的。”

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值