精华内容
参与话题
问答
  • Htm5 坦克大战

    千次阅读 2013-04-05 20:02:47
    经典的坦克大战  Html5经典的坦克大战          //得到画布  var canvas = document.getElementById("tankMap");  //得到画笔  var cxt = canvas.getContext("2d");
    <!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>
        <title>经典的坦克大战</title>
    </head>
    <body οnkeydοwn="getCommand();" style="text-align:center" >
        <h1>Html5经典的坦克大战</h1>
        <!-- 坦克大战的战场 -->
        <canvas id="tankMap" width="600px" height="500px" style="background-color:Black"></canvas>
        <script src="js/tank.js" type="text/javascript"></script>
        <script type="text/javascript">


            //得到画布
            var canvas = document.getElementById("tankMap");
            //得到画笔
            var cxt = canvas.getContext("2d");


            //我的坦克(坦克的基准点)
            //方向 0表示向上,1表示向右,2表示像下,3表示向左
            var myTank = new MyTank(300, 400, 0,myTankColor);
            //定义子弹数组
            var myBullets = new Array();


            //定义敌人的坦克
            var enemyTanks = new Array();
            //定义敌人子弹的数组
            var enemyBullets = new Array();


            //定义一个炸弹数组(可以存放很多炸弹)
            var bombs = new Array();
            //先定义三个,后面把敌人坦克的数量,作出变量
            //0->上,1->右,2->下,3->左
            for (var i = 0; i < 3; i++) {
                //创建一个坦克
                var enemyTank = new EnemyTank((i + 1) * 50, 3, 2, enemyColor);
                //把这个坦克放入数组
                enemyTanks[i] = enemyTank;
                //启动这个敌人的坦克
                window.setInterval("enemyTanks[" + i + "].run()", 50);
                //当创建敌人坦克时就会分配子弹,子弹速度为3
                var eb = new Bullet(enemyTanks[i].x + 9, enemyTanks[i].y + 30, 2, 3, "enemy", enemyTanks[i]);


                enemyBullets[i] = eb;
                //启动该子弹
                var ettimer = window.setInterval("enemyBullets[" + i + "].run()", 50);
                enemyBullets[i].timer = ettimer;
            }


            //先调用一次
            flashTankMap();


            //专门写一个函数,用于定时刷新我们的作战区,把要在作战区出现的元素(子弹,坦克,障碍物等绘制出来)
            function flashTankMap() {
                //把画布清理
                cxt.clearRect(0, 0, 600, 500);
                //我的坦克
                drawTank(MyTank);


                //画出自己的子弹
                //子弹飞的效果原理是,每隔一段时间setInterval就去刷新工作区
                drawMyBullet();


                //敌人的坦克
                //判断一下敌人的坦克是否被击中
                isHitEnemyTank();
                drawEnemyBomb();
                drawEnemyBullet();


                //画出所有敌人的坦克
                for(var i=0;i<3;i++) {
                    drawTank(enemyTanks[i]);
                }


            }


            //绘制坦克
            drawTank(myTank);


            //判断键盘按键
            function getCommand() {
                //说明当时按下的是什么键,-->event对象-->事件处理函数
                var code = event.keyCode; //对应字母的ascii码


                switch (code) {
                    case 87: //W
                        myTank.MoveUp();
                        break;
                    case 68: //D
                        myTank.MoveRight();
                        break;
                    case 65: //A
                        myTank.MoveLeft();
                        break;
                    case 83: //S
                        myTank.MoveDown();
                        break;
                    case 74:
                        myTank.shotEnemy();
                        break;
                }
                //触发这个函数flashTankMap();
                flashTankMap();
                //清理画布
    //            cxt.clearRect(0, 0, 600, 500); //重绘画布
    //            //清理过后重新绘制
    //            drawTank(myTank);
                window.setInterval("flashTankMap()",100);
            }
        </script>
    </body>

    </html>





    js:

    //定义两个颜色数组
    var myTankColor = new Array("#F0C970", "#FCD152");
    var enmeyColor = new Array("#00A2B5", "#00FEFE");


    //定义一个炸弹类
    function Bomb(x, y) {
        this.x = x;
        this.y = y;
        this.isLive = true; //炸弹是否是活的,默认为true;
        this.blood = 9; //炸弹生命值
        this.bloodDown = function () {
            if (this.bood > 0) {
                this.blood--;
            }
            else {
                this.isLive = false; //说明炸弹死亡
            }
        }
    }


    //子弹类
    //type表示区分是别人的子弹,还是自己的子弹
    //tank表示对象,说明这可子弹是属于哪个坦克
    function Bullet(x, y, direct, speed, type, tank) {
        this.x = x;
        this.y = y;
        this.direct = direct;
        this.speed = speed;
        this.timer = null;
        this.isLive = null;
        this.type = type;
        this.tank = tank;
        this.run = function () {
            //先判断字段是否已经碰到边界
            //子弹不前进,有两个逻辑,1.碰到边界,2.碰到敌人的坦克
            if (this.x <= 0 || this.x >= 600 || this.y <= 0 || this.y >= 500 || this.isLive == false) {
                //子弹要停止
                window.clearInterval(this.timer);
                //子弹死亡
                this.isLive = false;


                if (this.type == "enemy") {
                    this.tank.bulletIsLive = false;
                }
                else {
                    switch (this.direct) {
                        case 0:
                            this.y -= this.speed;
                            break;
                        case 1:
                            this.x += this.speed;
                            break;
                        case 2:
                            this.y += this.speed;
                            break;
                        case 3:
                            this.x -= this.speed;
                            break;
                    }
                }
                document.getElementById("aa").innerText = "子弹x=" + this.x + "子弹y=" + this.y;
            }
        }
    }
    //坦克类
    function Tank(x, y, direct,color) {
        this.x = x;
        this.y = y;
        this.direct = direct;
        this.isLive = true;
        this.color = color;//一个坦克需要两种颜色
        this.speed = 3; //默认速度为1
        //上移
        this.MoveUp = function () {
            this.y -= this.speed;
            this.direct = 0;
        }
        //下移
        this.MoveDown = function () {
            this.y += this.speed;
            this.direct = 2;
        }
        //左移
        this.MoveLeft = function () {
            this.x -= this.speed;
            this.direct = 3;
        }
        //右移
        this.MoveRight = function () {
            this.x += this.speed;
            this.direct = 1;
        }
    }


    //定义我的坦克
    function MyTank(x, y, direct, color) {
        //下面两句话是通过对象冒充,达到继承的效果
        this.tank = Tank;
        this.tank(x, y, direct, color);


        //增加一个函数,射击敌人的坦克
        this.shotEnemy = function () {
            //创建子弹,子弹的位置和自己坦克的位置有关系,并且和方向有关
            //this.x就是当前坦克的横坐标
            switch (this.direct) {
                case 0: //上
                    myBullet = new Bullet(this.x + 15, this.y + 2, this.direct, 1, "hero", this);
                    break;
                case 1: //右
                    myBullet = new Bullet(this.x + 28, this.y + 15, this.direct, 1, "hero", this);
                case 2: //下
                    myBullet = new Bullet(this.x + 15, this.y + 28, this.direct, 1, "hero", this);
                    break;
                case 3: //左
                    myBullet = new Bullet(this.x + 2, this.y + 15, this.direct, 1, "hero", this);
            }
            //把这个子弹对象放入到数组中->push函数
            myBullets.push(myBullet);
            //调用我们的子弹run
            //每个子弹的定时器是独立,如果按原来的方法
            //则所有的子弹共享一个定时器
            var timer = window.setInterval("myBullets[" + (myBullets.length - 1) + "].run()", 50);
            //把这个timer赋给每一个子弹(js对象是引用传递)
            myBullets[myBullets.length - 1].timer = timer;
        }
    }


    //定义一个EnemyTank类
    function EnemyTank(x,y,direct,color) {
        //也通过对象来冒充,来继承Tank
        this.tank = Tank;
        this.count = 0;
        this.bulletIsLive = true;


        this.tank(x, y, direct, color);


        this.run = function () {
            //判断敌人的坦克的前进方向
            switch (this.direct) {
                case 0:
                    if (this.y > 0) {
                        this.y -= this.speed;
                    }
                    break;
                case 1:
                    if (this.x + 30 < 500) {
                        this.x += this.speed;
                    }
                    break;
                case 2:
                    if (this.y + 30 < 600) {
                        this.y += this.speed;
                    }
                    break;
                case 3:
                    if (this.x > 0) {
                        this.x -= this.speed;
                    }
                    break;
            }
            //改变方向,走三十次,在改变方向
            if (this.count > 30) {
                //math.round返回的是最接近的整数,math.random产生0.1-1.0之间的数
                this.direct = Math.round(Math.random() * 3); //随机生成0,1,2,3
                this.count = 0;
            }
            this.count++;


            //判断子弹是否已经死亡,如果死亡,则增加新的一颗子弹
            if(this.bulletIsLive==false) {


                switch(this.direct){
                //重新产生子弹的时候需要考虑当前坦克的状态
                    case 0: //上
                        etBullet = new Bullet(this.x + 15, this.y + 2, this.direct, 1, "hero", this);
                        break;
                    case 1: //右
                        etBullet = new Bullet(this.x + 28, this.y + 15, this.direct, 1, "hero", this);
                        break;
                    case 2: //下
                        etBullet = new Bullet(this.x + 15, this.y + 28, this.direct, 1, "hero", this);
                        break;
                    case 3: //左
                        etBullet = new Bullet(this.x + 2, this.y + 15, this.direct, 1, "hero", this);
                        break;
                    }
                //把子弹添加到敌人子弹数组中
                enemyBullets.push(etBullet);
                //启动新子弹run
                var mytimer=window.setInterval("enemyBullets["+(enemyBullets.lendth-1)+"].run()",50);
                enemyBullets[enemyBullets.length-1].timer=mytimer;


                this.bulletIsLive=true;
            }
        }
    }


    //画自己的子弹,要把这个函数封装到myTank类中
    function drawMyBullet() {
        //现在要画出所有的子弹
        for(var i=0;i<myBullets.length;i++)
        {
            var myBullet=myBullets[i];
            if(myBullet!=null&&myBullet.isLive)
            {
                cx.fillStyle="#FEF26E";
                cxt.fillRect(myBullet.x,myBullet.y,2,2);
            }
        }
    }


    //画敌人的子弹,当然敌人的子弹和自己的子弹可以合并
    function drawEnemyBullet()
    {
        //现在要画出所有子弹
        for(var i=0;i<enemyBullets.length;i++)
        {
            var etBullet=enemyBullets[i];
            if(etBullet.isLive)
            {
                cxt.fillStyle="#00FEFE";
                cxt.fillRect(etBullet.x,etBullet.y,2,2);
            }
        }
    }


    //绘制坦克(敌人和自己的坦克)
    //把绘制坦克封装成一个函数,将来可以作为成员函数
    function drawTank(tank) {
        //说明所有的坦克都要isLive这个属性
        if(tank.isLive)
        {
            //考虑方向
            switch (tank.direct) {
                case 0: //上
                case 2: //下
                    //使用自己的坦克,使用绘图技术
                    //设置颜色
                    cxt.fillStyle = tank.color[0];


                    //坦克
                    cxt.fillRect(tank.x, tank.y, 5, 30); //左轮
                    cxt.fillRect(tank.x + 5, tank.y + 7, 16, 16); //坦克身
                    cxt.fillRect(tank.x + 5 + 16, tank.y, 5, 30); //右轮


                    //画一个盖子(内圆)
                    cxt.beginPath();
                    cxt.fillStyle = tank.color[1];
                    cxt.arc(tank.x + 5 + 8, tank.y + 7 + 8, 8, 0, 360, true); //(x,y,r,开始角度,结束角度,是否顺时针)
                    cxt.closePath();
                    //填充实心的圆形
                    cxt.fill();


                    //设置线条的宽度
                    cxt.lineWidth = 4;
                    cxt.beginPath();
                    cxt.moveTo(tank.x + 13, tank.y + 15);
                    //炮筒
                    //cxt.fillRect(tank.x + 5 + 6, tank.y + 2, 4, 5);
                    cxt.strokeStyle = tank.color[1];
                    if (tank.direct == 0) {
                        cxt.lineTo(tank.x + 13, tank.y + 2);
                    } else if (tank.direct == 2) {
                        cxt.lineTo(tank.x + 13, tank.y + 28);
                    }


                    cxt.closePath();
                    cxt.stroke();
                    break;
                //左和右  
                case 1:
                case 3:
                    //画出自己的坦克,使用前面的绘图技术
                    //设置颜色
                    cxt.fillStyle = tank.color[0];
                    //韩老师使用 先死--->后活 (初学者最好用这个方法)
                    //先画出右面的矩形
                    cxt.fillRect(tank.x, tank.y, 30, 5);
                    //画出左边的矩形
                    cxt.fillRect(tank.x, tank.y + 21, 30, 5);
                    //画出中间矩形
                    cxt.fillRect(tank.x + 7, tank.y + 5, 16, 16);
                    //画出坦克的盖子
                    cxt.fillStyle = tank.color[1];
                    cxt.arc(tank.x + 15, tank.y + 13, 8, 0, 360, true);
                    cxt.fill();
                    //画出炮筒(直线)
                    cxt.strokeStyle = tank.color[1];
                    //设置线条的宽度
                    cxt.lineWidth = 4;
                    cxt.beginPath();
                    cxt.moveTo(tank.x + 15, tank.y + 13);
                    //向右
                    if (tank.direct == 1) {
                        cxt.lineTo(tank.x + 28, tank.y + 13);
                    } else if (tank.direct == 3) { //向左
                        cxt.lineTo(tank.x + 2, tank.y + 13);
                    }


                    cxt.closePath();
                    cxt.stroke();
                    break;
            }
        }
    }
    //编写一个函数,专门用于判断我的子弹,是否集中某个敌人的坦克
    function isHitEnemyTank() {
        //取出每一颗子弹
        for(var i=0;i<myBullets.length;i++)
        {
            //取出每一颗子弹
            var myBullet=myBullets[i];
            if(heroBullet.isLive) //子弹是活的,才去判断
            {
                //让这颗子弹去和遍历每个敌人坦克判断
                for(var j=0;j<enemyTanks.length;j++)
                {
                    var enemyTank=enemyTanks[j];
                    //子弹集中敌人坦克的条件是什么?
                    //看这颗子弹是否进入敌人坦克所在的矩形
                    //根据当时敌人坦克的方向来决定
                    if(enemyTank.isLive)
                    {
                        switch(enemytank.direct)
                        {
                            case 0:
                            case 2:
                                if(myBullet.x>=enemyTank.x&&myBullet.x<=enemyTank.x+26&&myBullet.y>=enemyTank.y&&myBullet.y<=enemyTank.y+30)
                                {
                                    //把坦克isLive设置为false,表示死亡
                                    enemyTank.isLive=false;
                                    //该子弹也死亡
                                    myBullet.isLive=false;
                                    //创建一颗炸弹
                                    var bomb=new Bomb(enemyTank.x,enemyTank.y);
                                    //然后把该炸弹放入到booms数组中
                                    bombs.push(bomb);
                                }
                                break;
                            case 1:
                            case 3://左右方向
                                 if(myBullet.x>=enemyTank.x&&myBullet.x<=enemyTank.x+30&&myBullet.y>=enemyTank.y&&myBullet.y<=enemyTank.y+26)
                                {
                                    //把坦克isLive设置为false,表示死亡
                                    enemyTank.isLive=false;
                                    //该子弹也死亡
                                    myBullet.isLive=false;
                                    //创建一颗炸弹
                                    var bomb=new Bomb(enemyTank.x,enemyTank.y);
                                    //然后把该炸弹放入到booms数组中
                                    bombs.push(bomb);
                                }
                                break;
                        }
                    }
                }
            }
        }
    }


    //画出敌人的炸弹
    function drawEnemyBomb() {
        for(var i=0;i<bombs.length;i++)
        {
            //取出一颗炸弹
            var bomb=bombs[i];
            if(bomb.isLive)
            {
                //根据当前这个炸弹的生命值,来画出不同的炸弹图片
                if(bomb.blood>6)
                {
                    //显示最大炸弹图
                    var img1=new Image();
                    img1.src="imgs/bomb_1.gif";
                    var x=bombs.x;
                    var y=bombs.y;
                    img1.οnlοad=function () {
                        cxt.drawImage(img1,x,y,30,30);
                    }
                }
                else if(bomb.blood>3)
                {
                    //显示中等炸弹图
                    var img3=new Image();
                    img3.src="imgs/bomb_2.gif";
                    var x=bombs.x;
                    var y=bombs.y;
                    img2.οnlοad=function () {
                        cxt.drawImage(img1,x,y,30,30);
                    }
                }
                else
                {
                    //显示最小炸弹图
                    var img3=new Image();
                    img3.src="imgs/bomb_3.gif";
                    var x=bombs.x;
                    var y=bombs.y;
                    img3.οnlοad=function () {
                        cxt.drawImage(img1,x,y,30,30);
                    }
                }
                //减血
                bomb.bloodDown();
                if(bomb.blood<=0)
                {
                    //把这个炸弹从数组中去掉
                    bombs.splice(i,1);
                }
            }
        }
    }




    展开全文
  • htm5 video 播放器

    2012-05-17 15:00:13
    一款功能很强大的web播放器,
  • htm5 特性

    2013-12-23 10:04:44
    http://www.css3-html5.com  1 输入占位符 placeholder 属性 2 自动焦点事件 3 电子邮件  4 网址 再说说网址输入框。如果需要输入网址,期望输入的就像 http://www.css3-html5.com。...
    

    http://www.css3-html5.com 


    1  输入占位符  placeholder 属性



    2 自动焦点事件


    3 电子邮件  <input  type='email'/>


    4 网址   再说说网址输入框。如果需要输入网址,期望输入的就像 http://www.css3-html5.com。现在在网址类型输入框会出现像iPhone里面一样的一个可变化的虚拟键盘用户可以很方便输入斜线和.com。同样的,在提交表单之前用户对这些毫不知情。


    5  数字  类型

     HTML4要得到匹配的数字,就得使用jquery脚本来帮助验证。HTML5增加了数字类型。还增加了一些额外的属性(可选):Min:指定输入框可接受的最小输入数字。Max:就是允许输入的最大数字。 Step:属性输入域合法的间隔 ,默认是1.

      <input type='number'  min='0'  max='100'   ste='10'  />



    6 数字滑动条

    HTML5允许你使用一个新的类型叫range,输入框变成一个滑动条。你的网站表单可以使用滑动条了,它的属性标记和数字类型一样,只是把类型设置type='number'改成type='range'。

      <input type='range'  min='0'  max='100'   ste='10'  />



    7  搜索输入框

    <input  type='search'   placeholder='type in  search' />



    8  表单验证

    最令人兴奋的新特性莫过于表单验证。大多数开发人员都做了表单验证,无论是客户端或服务器端。也许HTML5的表单验证器可能无法取代你的服务器端验证,但它肯定能最终取代你的客户端验证。 JavaScript验证的问题是,用户很容易绕过它,可以很容易绕过它只需禁用JavaScript。现在HTML5,你不用有此担心,错误都是HTML5原生提示的,未使用JavaScript。


     

    展开全文
  • HTM5规范

    千次阅读 2010-12-17 16:21:00
    HTML5规范 http://www.w3.org/TR/html5/<br />  HTML 5 WebSocket 示例  http://blog.csdn.net/dl88250/archive/2010/01/01/5118301.aspx
    展开全文
  • htm5网站源代码

    2014-10-08 21:51:58
    《html5网站源代码》是一个非常好的网页源代码,视觉效果好,代码少,利于优化,只要稍微修改一下,即可成为自己的网站,非常好的一个东西,建议大家下载看看,谢谢!
  • 手机HTM5下拉刷新控件

    2016-12-30 10:03:04
    手机HTM5下拉刷新控件
  • htm5 播放视频流

    2011-01-07 11:13:30
    今天在百度百科中看到 <video> 标签定义视频,比如电影片段或其他视频流。...但是html5是怎么播放视频流的那?视频流 和 流媒体一样的吗?不是很明白,但是人家说可以直接播放流,有谁可以解释下啊?
  • HTM5:拖放

    千次阅读 2016-06-23 15:26:40
    一:单一拖放 #div1{width: 900px;height: 200px;padding: 10px;border: 1px solid #aaaaaa;} function allowDrop(ev) { ev.preventDefault(); } ... ev.dataTr

    一:单一拖放


    <span style="font-size:18px;"><!DOCTYPE html>
    <html>
    	<head>
    		<meta charset="UTF-8">
    		<title></title>
    	</head>
    	<style type="text/css">
    		#div1{width: 900px;height: 200px;padding: 10px;border: 1px solid #aaaaaa;}
    	</style>
    	<script type="text/javascript">
    		function allowDrop(ev)
    		{
    			ev.preventDefault();
    		}
    		function drag(ev)
    		{
    			ev.dataTransfer.setData("Text",ev.target.id);
    		}
    		function drop(ev)
    		{
    			ev.preventDefault();
    			var data=ev.dataTransfer.getData("Text");
    			ev.target.appendChild(document.getElementById(data));
    		}
    	</script>
    	<body>
    		<P>把图片拖放到矩形中</P>
    		<div id="div1" οndrοp="drop(event)" οndragοver="allowDrop(event)">
    			
    		</div>
    		<img id="drag1" src="img/test.png" draggable="true" οndragstart="drag(event)"/>
    	</body>
    </html>
    </span>


    代码分析

    1)设置元素可拖放

    把元素的draggable属性设置为true,元素才可以被拖放。

    <img draggable="true" />

    2)谁被拖放:ondragstart()和setData()

    上面的案例中:drag()函数规定了被拖动的数据,dataTransfer.setData()设置被拖动的数据的数据类型和值。

    function drag(ev)
    {
    ev.dataTransfer.setData("Text",ev.target.id);
    }
    在上面案例中:数据类型是“Text”,值是可拖动元素id("drag1")

    3)拖放到何处:ondragover

    ondragover规定了在何处放置被拖动的数据

    ev.preventDefault() 阻止对元素的默认处理

    event.preventDefault()

    4)进行放置:ondrop

    放置被拖动的数据时会发生drop事件

    function drop(ev)
    {
    ev.preventDefault();
    var data=ev.dataTransfer.getData("Text");
    ev.target.appendChild(document.getElementById(data));
    }

    二:来回拖放


    <span style="font-size:18px;"><!DOCTYPE html>
    <html>
    	<head>
    		<meta charset="UTF-8">
    		<title></title>
    	</head>
    	<style type="text/css">
    		#div1,#div2{
    			float: left;
    			width: 100px;
    			height: 100px;
    			margin: 10px;
    			padding: 10px;
    			border: 1px solid #aaaaaa;
    		}
    	</style>
    	<script type="text/javascript">
    		function allowDrop(ev){
    			ev.preventDefault();
    		}
    		function drag(ev){
    			ev.dataTransfer.setData("Text",ev.target.id);
    		}
    		function drop(ev){
    			ev.preventDefault();
    			var data = ev.dataTransfer.getData("Text");
    			ev.target.appendChild(document.getElementById(data));
    		}
    	</script>
    	<body>
    	<div id="div1" οndrοp="drop(event)" οndragοver="allowDrop(event)">
    		<img id="drag1" src="img/test2.png" draggable="true" οndragstart="drag(event)" />
    	</div>
    	<div id="div2" οndrοp="drop(event)" οndragοver="allowDrop(event)"></div>
    	</body>
    </html></span>
    



    展开全文
  • HTM5L特效

    千次阅读 2013-07-21 17:48:43
    作为下一代网页语言,HTML5 拥有很多让人期待已久的新特性。如今,很多 Web 开发人员开始使用 HTML5 来制作各种丰富的 Web 应用来代替 Flash。本文向大家展示10个让人眼花缭乱的 HTML5 和 JavaScript 效果,让你体验...
  • 仿支付宝数字密码输入框htm5+css 博客地址:http://blog.csdn.net/qq_34020571/article/details/79577946
  • HTM5 实现文件拖拽

    2013-09-08 23:20:40
    HTM5 实现文件拖拽
  • htm5文件上传预览

    2016-06-21 15:31:53
    上传预览 function preview(){ var fileEle=document.getElementById("file"); var file=fileEle.files[0]; var reader = new FileReader(); reader.onload = function(e) { ...
  • HTM5学习前篇

    2016-04-30 11:07:52
    知识储备 1.html+css 2.javascript 3.任何一门服务器端语言 2.准备工作 1.chrom 浏览器 2.ff浏览器 3.opera浏览器 4.ie9+浏览器 5.ietester
  • 我想要找一个用htm5/js 对网站根目录下的sqlite数据库进行查询的办法 这个网站是离线使用的,不需要服务器提供数据库 使用js访问本地sqlite数据库 只需要查询数据库 不要使用什么什么.js 只需要给...
  • 今天有幸发现了一篇外国大神写的文章,详细的介绍了HTML的发展过程,以及HTML5的来源,其中也给我纠正了一个问题--关于DOCTYPYE的真正含义,先把书名发出来,再好好说说这个DOCTYPE的问题,书名《HTML5的设计》。...
  • HTM5视频标签「video」

    千次阅读 2020-07-07 15:28:44
    HTM5视频标签标签定义及使用说明主要属性属性介绍autoplaycontrolsheightloopmuted定义和用法 标签定义及使用说明 标签定义视频,比如电影片段或其他视频流。 目前, 元素支持三种视频格式:MP4、WebM、Ogg。 ...
  • h5的应用程序缓存,为应用带来了三大优势:1,可以让用户离线浏览;2,提高加载速度;3,减少服务器负载。这么好的东西,IE对它的支持...直接上代码:html5代码:&lt;!DOCTYPE html&gt; &lt;html lang=...
  • GT Grid HTM5 博客参考

    2018-09-18 12:52:00
    GT Grid HTM5 博客参考  http://fins.iteye.com/blog/316548
  • HTM5 Basic<1>

    2013-09-12 09:51:05
    WebFormDemo.css : body {  text-align:center; } div.round1 {  border:6px solid;  width:200px;  height:70px;  padding-top:30px;... margin:10px auto 5px auto;  border-radiu
  • htm5 基础函数的作用

    2011-12-09 18:27:22
    1. translate(80,80)的意思就是说以x=80,y=80的这个像素点作为(0,0)坐标,以后的坐标都是相对于这个标准的。 2. rotate(90 * Math.PI / 180) 按顺时针旋转90度。
  • htm5和CSS3简介

    2020-11-06 08:21:52
    HTML5概述 HTML:超文本语言(Hyper Text Markip Language) 用来描述网页的一种语言 超文本: 1、包含了文字、图片、音/视频等,超越文本限制 2、从一个文件链接到另一个文件,超文本链接 网页:HTML格式的文件,常以.htm...
  • 页面有个 图片滑动层 (.swipeTmp),用的是一个插件。 插件需要在script里 定义插件的属性。 比如 $(.swipeTmp).abc({ "":"", "","" ...现在我是动态插入了这个图片滑动层, 如何绑定他的属性呢?

空空如也

1 2 3 4 5 ... 20
收藏数 10,223
精华内容 4,089
关键字:

htm5