自定义博客皮肤VIP专享

*博客头图:

格式为PNG、JPG,宽度*高度大于1920*100像素,不超过2MB,主视觉建议放在右侧,请参照线上博客头图

请上传大于1920*100像素的图片!

博客底图:

图片格式为PNG、JPG,不超过1MB,可上下左右平铺至整个背景

栏目图:

图片格式为PNG、JPG,图片宽度*高度为300*38像素,不超过0.5MB

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

-+
  • 博客(11)
  • 资源 (3)
  • 收藏
  • 关注

原创 富文本编辑的利器execCommand

富文本编辑中一个非常关键的document属性execCommand(command,boole,val);这个属性可以得到并且编辑我们当前选则文档节点内容。我们上一节讲过createRange以及createTextRange,都是针对文档去创建并保存一个range选区,一般不会用来去做富文本编辑这种需求,而只是单纯的去做单个或者几个选取插入以及对光标处理效果;如果非得要用这两个去实现富

2013-11-26 13:59:44 4996

原创 js光标选区操作

拿input框来举例子:平时我们操作input或者textArea需要用到该技术情况下一般有两处:一:点击一个按钮在input框中特定位置插入一段文本;二:选中一段文本进行操作实现两个效果时候ie以及非ie实现方式不同。具体看看各自是如何实现的:非ie下实现第一个效果一般都会用到三个步骤1、获取选区起始坐标偏移量:非ie下可以应用ele.selectionStart以及ele.

2013-11-26 10:27:29 3288 1

原创 HTML5之Web Worker

Web Worker是什么:web worker是html5提供的一个多线程解决方案,(以下我们简称为wWorker),大家都知道js是单线程执行的,所谓多线程解决方案也就是不需要js在执行时候摁着一个线程可劲使用,比如有些时候我们不小心会弄出死循环 或者大量计算时候,浏览器就会在它执行的线程中去执行我们的计算,从而导致ui渲染线程挂起浏览器就over了,这就是单线程处理的结果,多线程

2013-11-18 16:06:26 1097

原创 iframe及其跨域通讯方式集合

iframe通讯分为两种情况,一个是同域下通讯,另一个是跨域通信先看看同域下父子页面通讯:我们写两个页面便于比较分析:父页面parent.html:            function say() {        alert("我是父页面方法");      }      function callChild(){        myFrame.w

2013-11-18 11:51:44 11374 1

原创 javascript深度拷贝分析

先来介绍一下深拷贝是如何而来的。深拷贝是对比与浅拷贝而言的,我们都知道js中分为基本类型以及引用类型,基本类型都是保存在栈里面的,而引用类型仅仅是把地址保存在栈里面,而值是存在于堆里面,浅拷贝仅仅是拷贝栈里面东西;也就是说对于基本类型而言在栈里面重新开辟一个空间保存复制后的值和址,而对于引用类型而言仅仅是把地址复制过来,而这个地址指向的依然是原来址指向的那个堆里面的值,这样一来如果我们浅复

2013-11-14 16:05:44 2112

原创 js文本框监听

主流浏览器包括firefox、chrome以及ie高版本都支持oninput方法监听文本框变化,此外ie有自己的监听方法:onpropertychange方法。根据这些我们就可以做兼容各种浏览器的文本框监听方法:var inputArea=document.getElementById('myInput');if(window.addEventListener){inputArea.a

2013-11-14 10:09:10 1802

原创 canvas讲解进阶篇五

进阶三篇我们讲过了剪裁缩放 所用到的canvas方法也就是drawImage,我们也知道了drawImage方法有三套用法可以直接将图像放置于绘图环境、可以将图像缩放放置于绘图环境也可以将图像剪裁后放置绘图环境。利用我们讲过的图像剪裁缩放可以制作背景图片滚动效果,例如制作游戏程序时候背景图片的部分显示等功能。大家可以发散思维的。这篇文章主要讲图像制作包含两个大部分:离屏canvas以及

2013-11-13 15:53:28 3272 2

原创 canvas讲解进阶篇四

贝塞尔曲线、坐标变换以及图像合成我们之前说过:canvas的元素大小与绘图环境大小不一定相同,例如我们通过css定义canvas的宽高后,改变的只是canvas元素的宽高,而绘图环境的宽高还是不变的,当我们在canvas内部作图时候,绘图环境会默认的缩放到canvas元素大小,这时候如果我们绘制1像素那么该1像素就会被缩放同样倍数。很多时候我们需要根据用户鼠标位置去操作canvas环境。这

2013-11-12 14:42:37 1546

原创 canvas讲解进阶篇三

承上启下:上篇我们说过了canvas中绘图的颜色阴影以及渐变操作,这些有时候是给我们绘图锦上添花有时候是审美需要,无论如何 都是canvas不可获取的一部分,canvas中还有一些操作可以为你实现比较复杂的效果例如文本书写、剪裁缩放、以及图像合成、滤镜通道(后续)等。这篇文章主要为大家介绍一下文本以及剪裁缩放。文本文本的描边与填充在实际操作时候跟其他基本图形一样,只是调用方法有所不同,

2013-11-08 14:50:58 1957 1

原创 canvas讲解进阶篇二

上篇我们讲解过canvas的基础图形绘制,包括线段矩形以及圆弧。看上去这三个组合能完成很多东西(毕竟不是ps),但是实际canvas功能很强大的,可以实现ps中大部分功能,甚至在js控制下完成flash的东东。这一篇我们讲解的东西不是为了让canvas多么绚丽,而是在实际中我们的画布不能那么光秃秃黑乎乎的,总要有点颜色效果吧,这叫做客户体验。哈哈下面我们依次来说说canvas的颜色(填充透

2013-11-06 17:35:20 1417 1

原创 canvas讲解进阶篇一

html5中最强大的武器当属canvas莫属。从文字处理到电子游戏,canvas都会提供给你而且总体而言运行速度相当快,而且编码良好的canvas应用程序无需修改即可在任何兼容html5浏览器中进行运行。偶尔因为canvas更新而浏览器版本跟不上导致细微差别。而针对低版本ie的兼容我们过会儿再说。我们先从canvas基本开始走起:实现canvas首先要在页面中定义一个canvas元素,

2013-11-06 14:02:41 2499 3

我的富文本编辑器

js的富文本编辑器,支持普通以及table和图片表情插入

2013-12-17

js瀑布流实现

根据滚动条位置加载图片实现瀑布流效果,图片按照高度排序加载

2013-12-16

离屏缩放canvas

利用canvas实现图片缩放可以发散扩展为游戏背景图片

2013-11-13

空空如也

TA创建的收藏夹 TA关注的收藏夹

TA关注的人

提示
确定要删除当前文章?
取消 删除