<!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">

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<title>test</title>

<script type="text/javascript">

          /*

     * Draw a Oval

     * The following is the formula of Oval.

     * All dots is drawn by it.

     * x = r*a*cosθ　(0 <= θ <= 2π)

     * y = r*b*sinθ　(0 <= θ <= 2π)

     * b*b + r*r = a*a //Pythagoras Theorem

     */

    var Circle = {

        centre_of_circle : {x:,y:},

        radius : ,

        dot : function(x,y,w){

            return "<div id='dot_"+x+y+"' style='display:none;font-size:0;width:"+w+"px;height:"+w+"px;position:absolute;background-color:#000;top:"+(y)+"px;left:"+(x)+"px'></div>";

        },

        draw : function(){

            var s = "",

                dots = ,

                a = ,

                b = ,

                dotsArr = [];

            for(var i = ; i < dots; i++){

                var x = Circle.centre_of_circle.x+Circle.radius*Math.cos(i**Math.PI/dots)*a;

                var y = Circle.centre_of_circle.y+Circle.radius*Math.sin(i**Math.PI/dots)*b;

                s += Circle.dot(x, y, );

                dotsArr.push({"y":y,"x":x});

            }

            document.body.innerHTML = s;

            return dotsArr;

        }

    }

    window.onload = function(){

        var dots = Circle.draw();

        var count = ;

        var t = window.setInterval(function(){

           document.getElementById("dot_"+dots[count].x+dots[count].y).style.display = "block";

           count++;

           if(count >= dots.length) window.clearInterval(t);

        },);

    }

</script>

</head>

<body>

</body>

</html>
<!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">

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<title>test</title>

<script type="text/javascript">

    /*

     * Draw a Oval

     * The following is the formula of Oval.

     * All dots is drawn by it.

     * x = r*a*cosθ　(0 <= θ <= 2π)

     * y = r*b*sinθ　(0 <= θ <= 2π)

     * b*b + r*r = a*a //Pythagoras Theorem

     */

    var Circle = {

        centre_of_circle : {x:,y:},

        radius : ,

        dot : function(x,y,w){

            return "<div id='dot_"+x+y+"' style='display:none;font-size:0;width:"+w+"px;height:"+w+"px;position:absolute;background-color:#000;top:"+(y)+"px;left:"+(x)+"px'></div>";

        },

        draw : function(){

            var dots = ,

                a = ,

                b = ,

                dotsArr = [];

            for(var i = ; i < dots; i++){

                var x = Circle.centre_of_circle.x+Circle.radius*Math.cos(i**Math.PI/dots)*a;

                var y = Circle.centre_of_circle.y+Circle.radius*Math.sin(i**Math.PI/dots)*b;

                dotsArr.push({"y":y,"x":x});

            }

            return dotsArr;

        },

        words : function(aObjArr){

            var s = "";

            s += "<a href='"+aObjArr.href+"' target='_blank' style='position:absolute;' id='a_"+aObjArr.id+"'>"+aObjArr.str+"</a>";

            return s;

        }

    }

    window.onload = function(){

        var dots = Circle.draw();

        var count = ;

        document.body.innerHTML = Circle.words({href:"http://www.baidu.com",id:dots[count].x+""+dots[count].y,str:"baidu"});

        var style = document.getElementById("a_"+dots[count].x+""+dots[count].y).style;

        var t = window.setInterval(function(){

           with(style){

               top = dots[count].y+"px";

               left = dots[count].x+"px";

               fontSize = (dots[count].y/)+"px"

           }

           count++;

           if(count >= dots.length){

               count = ;

           }

        },);

    }

</script>

</head>  

<body>

</body>

</html>

js画了一个椭圆的更多相关文章

  1. 用原生JS实现的一个导航下拉菜单，下拉菜单的宽度与浏览器视口的宽度一样（js+html+css）

    这个导航下拉菜单需要实现的功能是:下拉菜单的宽度与浏览器视口的宽度一样宽:一级导航只有两项,当鼠标移到一级导航上的导航项时,相应的二级导航出现.在本案例中通过改变二级导航的高度来实现二级导航的显示和消 ...

  2. jquery.wordexport.js打印echarts.js画出的柱状图

    jquery.wordexport.js打印echarts.js画出的柱状图. echarts画出的图是不能直接打印出来的(echarts的柱状图是用canvas画出来的),而jquery.worde ...

  3. SVG.JS 画弧线

    需求描述: 使用svg.js,绘制一个弧线.下图绿色弧线. 准备工作: 1.了解SVG Path中的A指令 详细文档,请戳这里 给定x半径.y半径后,经过指定的两点,可以有2个椭圆,因此两点间有2条弧 ...

  4. js获取上一个月、下一个月格式为yyyy-mm-dd的日期

    /** * 获取上一个月 * * @date 格式为yyyy-mm-dd的日期,如:2014-01-25 */ function getPreMonth(date) { var arr = date. ...

  5. JS实现的一个验证码，可以在前端验证后在提交action

    js实现的一个验证码功能,可以在前端判断验证码输入是否正确 输入的邮箱格式是否正确 验证成功后才提交action到后台 <!DOCTYPE html PUBLIC "-//W3C//D ...

  6. js如何获取一个月的天数 data javascript

    js如何获取一个月的天数 function days(year,month){ var dayCount; now = new Date(year,month, 0); dayCount = now. ...

  7. 用JS画斐波那契螺旋线（黄金螺旋线）

    偶然看到斐波那契螺旋线(黄金螺旋线)的定义及画图方法,试着用JS画了一下,很漂亮,很好玩 具体定义及画法大家查一下就有了,很简单. 以下是代码: <!DOCTYPE html> <h ...

  8. php中向前台js中传送一个二维数组

    在php中向前台js中传送一个二维数组,并在前台js接收获取其中值的全过程方法: (1),方法说明:现在后台将数组发送到前台 echo json_encode($result); 然后再在js页面中的 ...

  9. Node.js 撸第一个Web应用

    使用Node.js 创建Web 应用与使用PHP/Java 语言创建Web应用略有不同. 使用PHP/Java 来编写后台代码时,需要Apache 或者 Nginx 的HTTP 服务器,而接受请求和提 ...

随机推荐

  1. C++ AppendMenu

    主题 1.  系统菜单下面添加自定义菜单 2. 3. 4. 5.         AppendMenu The AppendMenu function appends a new item to th ...

  2. 支持向量机（SVM）非线性数据切割

    支持向量机(SVM)非线性数据切割 1.目标 本指导中你将学到: l  当不可能线性切割训练数据时,如何定义SVM最优化问题. l  在这样的问题上.如何配置CvSVMParams中的參数满足你的SV ...

  3. 怎样破解邮箱password

    破解邮箱password怎样破解邮箱password邮箱在我们的生活中日益成为一个不可或缺的角色.公司与公司之间的商贸往来,学生与老师间的学习交流,以及占非常大部分的私人信件的往来等等非常难离开它.但 ...

  4. 关于NuDaqPci 数据采集

    最近在做公司一个fct的测试及调试软件 设计到的比较多的通信问题 1,Gpib通信(调用ADL-GPIB) 2,串口通信 3,Usb通信(调用USBXpress) 4,Pci通信(调用PCIS-DAS ...

  5. mmc线性0-1规划问题

    本题目来自物理学苑,原作者认为mmc不容易解决0-1规划. 5个人选4个,组队游泳接力比赛,最好成绩组队. 其实,mmc解决此类问题,还是很方便,轻松的. 下面是原题目的求解:

  6. LINUX命令之ETHTOOL用法详解

    转载:http://crazyming.blog.51cto.com/1048571/738022 debian 下安装: sudo apt-get install ethtool 或者下载源码编译: ...

  7. Android进阶笔记07：Android之MVC 理解

     1. 为什么需要MVC ? 软件中最核心的,最基本的东西是什么?  答:是的,是数据.我们写的所有代码,都是围绕数据的.      围绕着数据的产生.修改等变化,出现了业务逻辑.      围绕着数 ...

  8. css笔记09：选择器优先级

    1. (1) <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www. ...

  9. JAVA实现DES加密

    DES加密介绍       DES是一种对称加密算法,所谓对称加密算法即:加密和解密使用相同密钥的算法.DES加密算法出自IBM的研究,后来被美国政府正式采用,之后开始广泛流传,但是近些年使用越来越少 ...

  10. java中的静态方法

    静态方法是属于类的,内存必须为它分配内存空间,这个空间一直由静态方法占用,内存管理器不会由于静态方法没有被调用而将静态方法的存储空间收回,这样如果将所有的方法都声明为静态方法,就会占用大量的内存空间, ...