jQuery 矩形内数字逆时针旋转

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

    <style type="text/css">

        .mytable

        {

width:300px;

        }

.mytable td{height:100px;border:1px solid #aaccff;text-align:center;}

.mytable td label{font-size:60px;font-weight:bold;color:Red;}

.box{border:1px solid #aaccff;padding:10px;margin:5px 3px;line-height:25px;}

    <script src="jquery-1.12.4.js">

        $(function () {

window.setInterval(fun, 300);

        });

        function fun() {

$("#table1 label")

//监听事件:获取label的值集合

                .map(function (value, index) {

//获取到单个label的文本值

                var $txt =$(index).text();

                //将其转换为int型

                    $txt =parseInt($txt);

                if ($txt ==8) {

//给当前label赋值

                    $(index).text("1");

                }

else {

//给当前label赋值

                    $(index).text($txt +1);

                }

});

        }


<body style="font-size:12px;">

    <div class="box">

        请编写javascript代码,完成如下功能要求:

        1.每隔300毫秒,让所有的数字逆时针旋转

    <div class="box">

        <table id="table1" class="mytable">

                    <label id="Label1">1

                    <label id="Label2">2

                    <label id="Label3">3

                    <label id="Label8">8

                    <label id="Label4">4

                    <label id="Label7">7

                    <label id="Label6">6

                    <label id="Label5">5

©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容