Web开发网 > Web前端开发 > Web前端开发教程 > HTML/CSS兼容/XML
首页 上一页 [1] [2] [3] [4] [5] [6] [7] [8] [9] [10] [11] 下一页 尾页 5/11页，每页显示30条，共320条相关记录
最近在修改一个游戏框架时发现页面渲染效率骤降，CPU从原先的10%左右上升到50%（一个核已经满负载了），FPS也下降不少。经过一番调试，发现 是其中的一个img元素引起的。和页面里其他img元素不同之处在于，这个图片的尺寸是通过脚本缩放的，难道图片的尺寸会影响渲染效率吗？下面来测试下。 这里选择一幅600*400的图片，让它随鼠标移动，..
1.globalAlpha 属性，设置透明效果function draw() { var ctx = document.getElementById('canvas').getContext('2d'); // 画矩形 ctx.fillStyle = '#FD0'; ctx.fillRect(0,0,75,75); ctx.fillStyle = '#6C0'; ctx.fillRect(75,0,75,75); ctx.fillStyle = '#09F)'; ctx.fillRect(0,75,75,75); ..
HTML5的Canvas自带API可以显示阴影效果，主要还是在画布(canvas)的上下文对象(context)上做文章 !DOCTYPE html head meta charset=UTF-8 titleHTML5 Combine Shape DEMO/title script type=text/javascript src=js/drawShadow.js/script /head body onload=draw('canvas')/body h2canvas：显示..
在HTML5中有11种组合图形的方式，只要把他们设置到context.globalCompositeOperation中就可以了，下面是一些证明各种图形组合方式的结果的示例。 HTML代码很简单，就2个控件，一个是下拉列表，让用户选择组合方式，并且一旦用户做出了选择，就执行js函数draw(id），从而在第二个控件canvas上根据用户当前选择的组合方式进行画图。第二个控..
在html5-Canvas API，介绍了基础的canvas方法，现在使用javascript+Canvas绘制时钟做一个示例。 在这里主要设置了坐标变换的平移（translate）和旋转变换（ratate），以及 html5 Canvas的路径绘图，beginPath，closePath，rect，arc等，还有就是html5 Canvas路径绘图重要的绘图状态的保存和恢复机制，save，restore。 javascript+Canv..
Geolocation API用于将用户当前地理位置信息共享给信任的站点，这涉及用户的隐私安全问题，所以当一个站点需要获取用户的当前地理位置，浏览器会提示用户是允许 or 拒绝。 哪些浏览器支持Geolocation API：IE9.0+、FF3.5+、Safari5.0+、Chrome5.0+、Opera10.6+、IPhone3.0+、Android2.0+，也就是说除IE6~IE8外，其它最新的浏览器基本上..
按照国内一HTML5先行者的例子仿写了一个用HTML5 API来操作本地SQLite数据库的例子，感觉这个功能蛮好玩的，但是还不够强大，尤其浏览器支持力度不够： !DOCTYPE html head meta charset=UTF-8 title使用HTML5本地数据库DEMO/title script type=text/javascript src=js/operateDB.js//script /head body onl..
canvas对象drawImage方法是canvas导入图片的一种方法，他有三种重载形式：drawImage(image,x,y)drawImage(image,x,y,width,height):伸缩drawImage(image,sourceX,sourceY,sourceWidth,sourceHeight,destX,destY,destWidth,destHeight):剪切伸缩 其中第一个参数image可以是page中的img元素，也可以是其他canvas元素,base64编码的URL或vide..
1.translate(x,y):平移，将画布的坐标原点向左右方向移动x，向上下方向移动y.canvas的默认位置是在（0,0）. 例子：画布原点假如落在（1，1），那么translate（10，10）就是在原点（1，1）基础上分别在x轴、y轴移动10，则原点变为（11,11）。2.scale（x,y）：扩大。x为水平方向的放大倍数，y为竖直方向的放大倍数。3.rotate(angel):旋转.angle指旋..
canvas画布是一项很强大的东西，先来看一下canvas中的坐标原点，及正、负坐标的取值 那就先试着画一个米字吧，高手莫笑！canvas id=diagonal style=border: 1px solid blue; width=200 height=200/canvasscript type=text/javascriptwindow.onload=function(){ var canvas = document.getElementByIdx_x('diagonal'); //指..
在web开发中可能会遇到flash遮挡页面中元素的情况，无论怎么设置flash容器和层的深度(z-index)也无济于事，现有的解决方案 是在插入flash的embed或object标签中加入wmode属性并设置为wmode=transparent或opaque。 wmode即窗口模式总共有三种，Macromedia官方的说法：window 模式 默认情况下的显示模式，在这种模式下flash player有自己..
javascript实现IE,firefox客户端图片预览，测试浏览器：IE6~8，firefox4.0。 google的chrome，safari，opera浏览器需要上传图片才行，这个不在讨论范围，上传后也变简单多了，将表单自动提交到隐藏iframe实现无刷新上传图片文件后，在服务器端保存图片然后返回路径，具体参考这篇文章：ajax无刷新上传文件，使用iframe模仿。 原理：由..
在IE浏览器下面，当文档申明为xhtml时，2个并排的在一起的输入控件，当一个输入框内容为非中文内容，另外一个为中文时，出现奇怪的问题。测试代码在最后1）IE8浏览器下面顶部会出现2px差距，没有对齐，并且输入框内的文字没有对齐，中文接近顶部，非中文内容和中文内容相差2px左右，如图一。图一2）IE7浏览器下面顶部对齐，但是输入框内的文..
在csdn看到一个问题：firefox浏览器下面，当设置一个容器内的子元素的margin-top为负值时，如果负值的绝对值超过容器的高度，结果不是完全隐藏了图片，而子元素会显示出margin-top设置的绝对值-容器高度这么多的内容。网上找了下据说是firefox特有的块级盒模型相邻的垂直margin会被折叠的问题。 测试代码如下，firefox和其他浏览器的表示..
CSS代码编写是设计师的一个重要工作。写一个CSS代码和实施所需的设计任务。是非常不容易的，，今天给大家带来几个不错的工具，您可以生成在线CSS代码。节省您的时间，并自动获得一个专业的CSS代码。如果你没有css编写经验，不要紧，这几个工具正是你的所需，在线代码生成。基本上css方面的全了，像背景，布局，样式等等都包含了，哈哈CSS3.0..
问题描述：在IE浏览器下，浮动层如果没有内容或者未设置过背景之类，当这个层浮动在正常内容的上面时，添加到浮动层上面的事件，如 click，mouseover等事件，当触发点在有正常内容的部分，不会响应事件，只有在没有内容的部分才会响应事件。其他浏览器如 firefox，chrome不会出现这种问题。 通过IE的开发人员工具得到下图 点击蓝色框框..