- 博客(37)
- 收藏
- 关注
RSS订阅原创 css3 图片颜色叠加--background-blend-mode
先创建一个DIV：divclass="mul">div> 给这DIV添加背景颜色和背景图片：.mul{ margin: 0 auto; border: solid 1px red; width: 400px; height: 500px; background: #5bd5a0 url("su1.jpg") no-repeat center
2016-06-04 14:50:52
12289
转载 JS--- (function(){...})() 是什么
function foo() {...} // 这是定义，Declaration；定义只是让解释器知道其存在，但是不会运行。foo(); // 这是语句，Statement；解释器遇到语句是会运行它的。IIFE 并非必须，传统一点可以这么写：function foo() {...}foo();那么为什么要 IIFE？
2016-05-27 15:17:46
477
转载 Scoping & Hoisting
var a = 1;function foo() { if (!a) { var a = 2; } alert(a);};foo();上面这段代码在运行时会产生什么结果？尽管对于有经验的程序员来说这只是小菜一碟，不过我还是顺着初学者常见的思路做一番描述：创建了全局变量 a，定义其值为 1创建了函数 foo在 fo
2016-05-27 15:14:17
386
原创 canvas图像滤镜---canvas getImageData() 方法
定义和用法getImageData() 方法返回 ImageData 对象，该对象拷贝了画布指定矩形的像素数据。对于 ImageData 对象中的每个像素，都存在着四方面的信息，即 RGBA 值：R - 红色 (0-255)G - 绿色 (0-255)B - 蓝色 (0-255)A - alpha 通道 (0-255; 0 是透明的，255 是完全可见的)color
2016-05-25 12:12:37
3664
原创 用canvas做图像遮罩---globalCompositeOperation 属性
globalCompositeOperation属性的官方解释：http://www.w3school.com.cn/tags/canvas_globalcompositeoperation.aspglobalCompositeOperation属性应用例子可以参考：http://blog.youkuaiyun.com/laijieyao/article/details/41862473
2016-05-25 10:19:11
13489
转载 JS--时间戳与日期之间的转换
//时间戳转换成日期时间2014-8-8 下午11：40：20function formatDate(ns){ return new Date(parseInt(ns) * 1000).toLocaleString().replace(/年|月/g, "-").replace(/日/g, " ");}//时间戳转换成八位日期2014-5-5 function userDate(uDa
2016-05-20 17:44:38
318
原创 svg线条动画基础
先介绍一个Stroke的几个属性：stroke 表示描边颜色。一般有如下类型值：none, currentColor, . none表示没有颜色，就是常规的颜色值。currentColor继承父标签的color颜色值。stroke-width 表示描边的粗细。stroke-linecap 表示描边端点表现方式。可用值有：butt, round, square, inherit. 表
2016-05-18 10:55:09
1400
原创 高斯模糊的实现
DIV:一、css: .blur { -webkit-filter: blur(10px); -moz-filter: blur(10px); -ms-filter: blur(10px); filter: blur(10px); filter: pr
2016-05-17 15:11:03
688
原创 SVG路径PATH
在使用之前建议下个PS或者FLASH玩玩里面的钢笔工具（FLASH里的钢笔工具比PS里的好用）PATH用到的指令：M----（X Y）：移动到Z----(none)：关闭路径L----（X Y）：画线到H----(X)：水平线到V----(Y)：垂直线到C----(X1 Y1 X2 Y2 X Y)：三次贝塞尔曲线S----(X1Y1 X Y)：光滑三次贝塞尔曲线到
2016-05-12 11:25:25
4589
1
转载 PHP--date()
date_default_timezone_set(PRC); /*把时间调到北京时间,php5默认为格林威治标准时间*/date ()a: "am"或是"pm" A: "AM"或是"PM" d: 几日，两位数字，若不足则补零；从"01"至"31" D: 星期几，3个英文字母，如:"Fri" F: 月份，英文全名，如:"January" h: 12小
2016-05-03 18:07:14
317
原创 文字超出部分用省略号显示
单行文本的情况：css: .single-line{ width: 200px; height: 40px; border: solid 1px #000000; overflow: hidden; /*文本不换行*/ white-
2016-04-18 11:23:37
7276
原创 文本溢出解决方案---jquery-dotdotdot插件的使用方法
插件下截地址：https://github.com/FrDH/jQuery.dotdotdot在文件头引入jquery和jquery.dotdotdot.js要能看到效果，DIV的高度貌似要超过了107px以上。反正当高度小于等于107px的时候，文本直接全变成一个省略号方式一：超出DIV部分变成省略号 $(function(){ $("#div1"
2016-04-18 10:55:49
15445
转载 让人看比较舒服的十种颜色
█ █ █ █ █19CAAD 8CC7B5 A0EEE1 BEE7E9 BEEDC7█ █ █ █ █D6D5B7 D1BA74 E6CEAC ECAD9E F4606C科学上最舒服的十种颜色" title="[实验田] 科学上最舒服的十种颜色" style="margin:0px; padding:0px;
2016-04-18 09:07:47
3296
原创 JS笔记--对数组进行操作的方法-->splice()
arrayObject.splice(index,howmany,item1,.....,itemX);数组.splice(要操作的位置,数量,要插入的元素);例：当iTem1元素的时候，只对数组进行删除操作 window.onload=function(){ var array=[1,2,3,4,5,6,7,8,9];
2016-03-29 09:28:51
332
原创 background的合并合并书写方式
background: [background-color] 背景颜色 [background-image] 背景图像 [background-repeat] 规定图像重复 [background-attachment] 规定滚动方式
2015-11-17 14:43:01
3320
原创 css3渐变
以这个效果为例：这是一个从 #dc6226 渐变到 #535e64在Mozilla 、Webkit、 Opera 下的使用方式background: -moz-linear-gradient(left,#dc6226,#535e64);background: -webkit-linear-gradient(left,#dc6226,#535e64);background:
2015-11-12 10:01:57
308
转载 JS中的prototype
本文基于下面几个知识点:1 原型法设计模式在.Net中可以使用clone()来实现原型法原型法的主要思想是，现在有1个类A,我想要创建一个类B,这个类是以A为原型的,并且能进行扩展。我们称B的原型为A。 2 javascript的方法可以分为三类：a 类方法b 对象方法c 原型方法例子：function P
2015-11-09 15:15:04
290
原创 函数调用--笔记
----------------------------------------------------------------------------------------------------------------1.直接调用script type="text/javascript"> function test(a,b){ return[this,a
2015-11-05 13:51:39
320
原创 JS中的return的用法---笔记
第一种用法：做为返回值返回一个bool值script> var add=function(a,b){ return b>a; } console.log(add(1,2));script>输出结果： false--------------------------------------------------------
2015-11-05 11:16:06
549
原创 一键拨号，发短信，QQ，百度地图导航
拨号代码：1、一键拨号2、一键拨号保存到手机电话本：将02787661888存入电话簿 发短信代码：发短信我在线QQ代码：QQ百度地图导航 乐方网络 body, html,#allmap {width: 100%;height: 1
2015-11-03 23:35:27
808
原创 动态调用CSS文件 JS文件的方法
动态加载css var link=document.createElement('link'); link.type='text/css'; link.rel='stylesheet'; link.href='1.css'; document.getElementsBy
2015-11-03 23:13:09
543
原创 判断网站的访问平台，并且动态加载外部CSS
判断是否是手机访问的网站，如果是手机访问，则引入CSS文件 //平台、设备和操作系统 var system ={ win : false, mac : false, xll : false };
2015-11-03 22:59:11
435
原创 Canvas渐变
画个普通的纯色的圆 var c=document.getElementById("myCanvas"); var cxt=c.getContext("2d"); cxt.fillStyle='#FF0000'; cxt.arc(100,100,80,Math.PI*0,Math.PI*2,true); cxt.fill();这个
2015-10-15 14:05:06
474
原创 Canvas绘制圆
之前练习了一下绘制矩形顺便了解了一些Canvas经常用到的属性名。---------------------------------------------------------------------------------------------------------------------------------------------------------------现在来练
2015-10-15 10:53:32
1220
原创 XHTML和HTML的区别
网页从HTML>>XHTML>>XML这个过程发展XHTML规范了HTML语言XHTML是最终发展成XML之前的过渡语言。XHTML相对HTML的一些区别1。XHTML 元素必须被正确地嵌套。错误：this is example.正确：this is example.2。XHTML 元素必须被关闭。错误：this is example.正确：this
2015-10-14 21:30:06
293
原创 W3C标准
万维网联盟（World Wide Web Consortium） 别称W3C标准一般我们的网页由三部分组成：结构（Structure） 表现（Presentation） 和行为（Behavior）.对应的标准：结构化标准语言主要包括XHTML和XML 。 表现标准语言主要包括CSS。 行为标准语言主要包括对象模型（W3C DOM）ECMAScript等。符合W3
2015-10-14 20:31:29
481
原创 在canvas上一些常见属性
以绘制矩形为例绘制一个只有边框的矩形： var c=document.getElementById("myCanvas"); var cxt=c.getContext("2d"); cxt.strokeStyle = "blue"; cxt.rect(20,10,150,75); cxt.stroke();c.getContext("2d
2015-10-14 15:38:46
1467
原创 绘制Canvas出现Cannot read property 'getContext' of null;
我在Chrome浏览器上出现这个问题的。解决方法：将绘制方法，即绘制图片的方法，放在body 下面因为chrome下需要文档载入完成后才能获得canvas对象
2015-10-14 15:02:58
31238
10
原创 阻止事件冒泡、捕获、和默认事件
阻止事件冒泡、捕获的方法：e.stopPropagation();阻止默认事件发生的方法：e.preventDefault();默认事件就是就是浏览器自带的，不是我们写的方法，比如，你滑动浏览器滚动条的时候，页面会向下滚动！这是就是默认事件！实例：body中：div id="a"> div id="b">div>div>写上js：
2015-09-16 17:52:22
1139
原创 图片轮播效果，实现思想！
图片轮播效果，基本上，一个网站，其它效果都可以没有，但是基本上都存在图片轮播的效果。这里就说说制作的思路。方法有很多种。因人而异。结构分析１ 要轮播的图片 bigM［］２ 底部小圆圈按钮smallM［］ 当你点击任意小圆圈，切换到对应的图！ 第０个小圆圈对应第０张的图。。。第１个小圆圈对应第１张的图。。。。 记住！数字是对应的开始： 假设 我们要轮播的图有６张：
2015-09-12 16:37:24
1519
原创 DIV 高度自适应的方法
我们现在给上面这DIV 设置高度自适应！第一种：.test{ width:500px; }就是这样，不给他设高度。 这样就会自动被DIV里的内容撑开了。注：当 .test 内部的DIV设了FLOAT属性的时候。就不管用了 所以请看第二种方法。.test{ width:500px; overflow: hi
2015-09-12 16:07:51
664
原创 详解JS的getByclass方法
JS给我们提供了document.getElementById(),document.getElementsByTagName()等获取元素的方法。但是没有通过类名获取元素的方法，所以我们要自己写一个方法。//通过class的选择器function getByClass(parent,cla) { var ele=parent.getElementsByTagName("
2015-09-12 16:01:00
3104
原创 JavaScript运动框架（全）
先看以下代码： #aa{ width: 500px; height: 500px; background-color: #000066; } window.onload=function(){ aa
2015-09-12 13:03:11
749
转载 分享一个制作JQ插件方法的文章
----------------------------------------------------------------------------------------------------http://www.cnblogs.com/Wayou/p/jquery_plugin_tutorial.html--------------------------------------
2015-09-07 23:42:10
439
原创 offset,client,scroll,getStyle获取元素宽高的区别
offset，client，scroll，这三个是已有的获取元素宽高的方法。getStyle是我们自己写的一种获取样式的办法，实际上是使用了getComputedStyle(obj,false)[name];的方法（IE下是obj.currentStyle[name]）。getStyle函数： function getStyle(obj,name)
2015-08-24 22:52:27
487
原创 分别利用JS和JQ获取数组索引值index的办法
今天在自己练习的过程中，突然要用到这个办法。可是之前只会用JS的方法获取，不懂怎么用JQ方法。所以又在网上搜了搜。现在特地总结一下：测试代码： 第一个 第一个 第一个 第一个JQuery方法（1）：index() ：返回指定元素相对于其他指定元素的 index 位置。
2015-08-22 18:36:45
22448
原创 很高兴加入写博客的行列，慢慢记录自己的一点点进步
第一次加入写博客的行列！毕业工作两个月了，靠了大学仅学的一点点HTML基础进了一家网站制作公司。太多的不懂，无论是难的还是简单的，一直都是自己一点点百度百度摸索摸索。为了寻找问题的解决的方案，翻到百度经验，贴吧，博客等都是家常便饭了。这些地方都给我给了我很多的帮助。进而有了自己写博客的想法。主要是出于以下几个目的。第一：把每次自己学到的一点点东西记录下来！第二：
2015-08-22 00:42:46
365
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人