上一页 1 ··· 6 7 8 9 10 11 12 13 14 ··· 16 下一页
2017年6月29日
纯CSS+HTML实现checkbox的思路与实例
摘要： checkbox应该是一个比较常用的html功能了，不过浏览器自带的checkbox往往样式不怎么好看，而且不同浏览器效果也不一样。出于美化和统一视觉效果的需求，checkbox的自定义就被提出来了。这里对实现方法做个总结。 实现思路 纯css实现的主要手段是利用label标签的模拟功能。label 阅读全文
posted @ 2017-06-29 14:52 风雨后见彩虹 阅读(3212) 评论(0) 推荐(2) 编辑
javaScript 设计模式之中介者模式示例
摘要： 飞机把注册信息放到铁塔里，发送数据到铁塔，报告其它的飞机一些信息。 阅读全文
posted @ 2017-06-29 14:26 风雨后见彩虹 阅读(427) 评论(0) 推荐(0) 编辑
CSS3 - @keyframes
摘要： 语法 必需。动画时长的百分比。 合法的值： 0-100% from（与 0% 相同） to（与 100% 相同） 定义和用法 通过 @keyframes 规则，您能够创建动画。 创建动画的原理是，将一套 CSS 样式逐渐变化为另一套样式。 在动画过程中，您能够多次改变这套 CSS 样式。 以百分比来 阅读全文
posted @ 2017-06-29 08:44 风雨后见彩虹 阅读(360) 评论(0) 推荐(0) 编辑
2017年6月28日
贝塞尔曲线与CSS3动画、SVG和canvas的应用
摘要： 简介 贝塞尔曲线是可以做出很多复杂的效果来的，比如弹跳球的复杂动画效果，首先加速下降，停止，然后弹起时逐渐减速的效果。 使用贝塞尔曲线常用的两个网址如下： 缓动函数：http://www.xuanfengge.com/easeing/easeing/ cubic-bezier：http://cubi 阅读全文
posted @ 2017-06-28 21:35 风雨后见彩虹 阅读(3338) 评论(0) 推荐(0) 编辑
CSS3动画属性：转换(transition)
摘要： W3C标准中对css3的transition这是样描述的：“css的transition允许css的属性值在一定的时间区间内平滑地过渡。这种效果可以在鼠标单击、获得焦点、被点击或对元素任何改变中触发，并圆滑地以动画效果改变CSS的属性值。” transition主要包含四个属性值：执行变换的属性：t 阅读全文
posted @ 2017-06-28 12:53 风雨后见彩虹 阅读(962) 评论(0) 推荐(1) 编辑
2017年6月19日
jQuery效果之简单的手风琴效果
摘要： 实现效果如图所示： html结构： js代码： 阅读全文
posted @ 2017-06-19 11:14 风雨后见彩虹 阅读(1156) 评论(0) 推荐(0) 编辑
2017年6月15日
[工具配置]requirejs 多页面，多入口js文件打包总结
摘要： 需要明确以下几点： 1.本地前端调试代码肯定是调用原始的路径以及代码，但是线上运行的肯定是通过打包后的另一个路径，这儿就是生成的dist文件夹了。 2.requirejs的引入，线上跟线下的路径怎么控制？我们是这样控制的，代码如下： 这个${resource}是服务端控制传递到页面中的，在本地调试这 阅读全文
posted @ 2017-06-15 14:46 风雨后见彩虹 阅读(1285) 评论(0) 推荐(0) 编辑
2017年6月14日
[工具配置]使用requirejs模块化开发多页面一个入口js的使用方式
摘要： 描述 知道requirejs的都知道，每一个页面需要进行模块化开发都得有一个入口js文件进行模块配置。但是现在就有一个很尴尬的问题，如果页面很多的话，那么这个data-main对应的入口文件就会很多。理论这样其实也没什么，但是到后面用grunt进行合并压缩就会有很多入口js，虽然这个入口js都把配置 阅读全文
posted @ 2017-06-14 09:15 风雨后见彩虹 阅读(722) 评论(0) 推荐(0) 编辑
2017年6月7日
JS怎样实现图片的懒加载以及jquery.lazyload.js的使用
摘要： 在项目中有时候会用到图片的延迟加载，那么延迟加载的好处是啥呢？ 我觉得主要包括两点吧，第一是在包含很多大图片长页面中延迟加载图片可以加快页面加载速度；第二是帮助降低服务器负担。 下面介绍一下常用的延迟加载插件jquery.lazyload.js以及怎样实现一个延迟加载的插件。 一：jquery.la 阅读全文
posted @ 2017-06-07 21:32 风雨后见彩虹 阅读(3927) 评论(0) 推荐(2) 编辑
2017年6月1日
JavaScript之Object对象常用属性与方法手册
摘要： MDN Object参考地址：https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Object 简单描述 Object 构造函数创建一个对象包装器。创建对象的方式：可以通过new Objec 阅读全文
posted @ 2017-06-01 08:27 风雨后见彩虹 阅读(1160) 评论(0) 推荐(0) 编辑
2017年5月24日
JS之函数实际参数转换成数组的方法[].slice.call(arguments)
摘要： 实际参数在函数中我们可以使用 arguments 对象获得 （注：形参可通过 arguments.callee 获得），虽然 arguments 对象与数组形似，但仍不是真正意义上的数组。 我们可以通过数组的 slice 方法将 arguments 对象转换成真正的数组。 方法一：通过Array.p 阅读全文
posted @ 2017-05-24 21:41 风雨后见彩虹 阅读(2354) 评论(1) 推荐(0) 编辑
2017年5月23日
jQuery效果之雪花飘落
摘要： 实现思路 1.在一定的频率下在页面中生成一定数目的雪花从上往下飘落； 2.在指定的时间内飘落后移除页面； 3.可设置雪花的大小，在一定范围内随机雪花大小； 4.什么时间后清除生成雪花，停止函数。 js代码 调用方式： 参数解释： 阅读全文
posted @ 2017-05-23 22:46 风雨后见彩虹 阅读(1778) 评论(0) 推荐(0) 编辑
2017年5月22日
CSS3效果：波浪效果
摘要： 实现效果 如图所示： 首先得准备三张图，一张是浅黄色的背景图loading_bg.png，一张是深红色的图loading.png，最后一张为bolang.png。 css代码 html代码 阅读全文
posted @ 2017-05-22 21:26 风雨后见彩虹 阅读(7752) 评论(1) 推荐(0) 编辑
2017年5月18日
JS的函数节流（throttle）
摘要： 什么是函数节流？ 介绍前，先说下背景。在前端开发中，有时会为页面绑定resize事件，或者为一个页面元素绑定拖拽事件（其核心就是绑定mousemove），这种事件有一个特点，就是用户不必特地捣乱，他在一个正常的操作中，都有可能在一个短的时间内触发非常多次事件绑定程序。而大家知道，DOM操作时很消耗性 阅读全文
posted @ 2017-05-18 22:33 风雨后见彩虹 阅读(5154) 评论(0) 推荐(0) 编辑
2017年5月17日
JS对全角与半角的验证，相互转化以及介绍
摘要： 1.什么是全角和半角? 全角：是一种电脑字符，是指一个全角字符占用两个标准字符(或两个半角字符)的位置。全角占两个字节。 汉字字符和规定了全角的英文字符及国标GB2312-80中的图形符号和特殊字符都是全角字符。在全角中，字母和数字等与汉字一样占据着等宽的位置。 半角：是指一个字符占用一个标准的字符 阅读全文
posted @ 2017-05-17 22:10 风雨后见彩虹 阅读(12929) 评论(1) 推荐(1) 编辑
2017年5月16日
RequireJS模块化编程详解
摘要： 1.模块的写法 模块化编程一般都有这么几个过渡过程，如下描述。 原始方法 上面的函数m1()和m2()，组成一个模块。使用的时候，直接调用就行了。 这种做法的缺点很明显："污染"了全局变量，无法保证不与其他模块发生变量名冲突，而且模块成员之间看不出直接关系。 对象写法 为了解决上面的缺点，可以把模块 阅读全文
posted @ 2017-05-16 23:11 风雨后见彩虹 阅读(1731) 评论(0) 推荐(0) 编辑
2017年5月15日
实现可扩展性的页面布局
摘要： 前面有一篇文章讲过《css实现两列布局，一列固定宽度，一列宽度自适应方法》，主要是讲实现一列固定宽度，一列宽度自适应的几种方法。 下面我在总结一下一般的三种扩展布局，这儿所示的扩展布局很常规，有的童鞋会说使用column或者flex啥的布局不是很方便吗，但是你也要看它的支持程度吧，比如你在手机端使用 阅读全文
posted @ 2017-05-15 21:22 风雨后见彩虹 阅读(1076) 评论(0) 推荐(0) 编辑
Web标准中xhtml规范的内容有哪些
摘要： 1.所有的标记都必须要有一个相应的结束标记 以前在HTML中，你可以打开许多标签，例如<p>和<li>而不一定写对应的</p>和</li>来关闭它们。但在XHTML中这是不合法的。XHTML要求有严谨的结构，所有标签必须关闭。如果是单独不成对的标签，在标签最后加一个"/"来关闭它。 2.所有标签的元 阅读全文
posted @ 2017-05-15 08:16 风雨后见彩虹 阅读(1883) 评论(0) 推荐(0) 编辑
JS之innerHTML，innerText，outerHTML，textContent的用法与区别
摘要： 示例html代码： 获得id为test的DOM对象，下面就不一一获取了。 test.innerHTML 描述：也就是从对象的起始位置到终止位置的全部内容,包括Html标签。 上例中的test.innerHTML的值也就是“<span style="color:red">test1</span> te 阅读全文
posted @ 2017-05-15 07:53 风雨后见彩虹 阅读(3889) 评论(0) 推荐(0) 编辑
2017年5月11日
《JavaScript高级程序设计》笔记：引用类型（五）
摘要： Object类型 创建object实例方法有两种。第一种方法使用new操作符后跟object构造函数。如下： 第二种方法使用对象字面量表示法。如下： Array类型 检测数组 使用instanceof操作符： ECMAScript5新增加Array.isArray()方法。这个方法的目的是最终确定某 阅读全文
posted @ 2017-05-11 16:21 风雨后见彩虹 阅读(657) 评论(0) 推荐(0) 编辑
2017年5月8日
HTML空格符号 nbsp; ensp; emsp; 介绍以及实现中文对齐的方法
摘要： 一：不同空格符合的区别 &nbsp; 半角的不断行的空白格（推荐使用） &ensp; 半角的空格 &emsp; 全角的空格 详细的含义： &nbsp;：这是我们使用最多的空格，也就是按下space键产生的空格。在HTML中，如果你用空格键产生此空格，空格是不会累加的（只算1个）。要使用html实体表 阅读全文
posted @ 2017-05-08 22:31 风雨后见彩虹 阅读(105634) 评论(0) 推荐(5) 编辑
2017年5月6日
web移动端，需要清楚设备像素比devicePixelRatio的应用
摘要： 我们这里所说的devicePixelRatio其实指的是window.devicePixelRatio, 被所有WebKit浏览器以及Opera所支持。 概念 devicePixelRatio ，它是设备上物理像素和设备独立像素( device-independent pixels (dips) ) 阅读全文
posted @ 2017-05-06 21:07 风雨后见彩虹 阅读(7988) 评论(0) 推荐(0) 编辑
CSS实现两列布局，一列固定宽度，一列宽度自适应方法
摘要： 不管是左是右，反正就是一边宽度固定，一边宽度自适应。 博客园的很多主题也是这样设计的，我的博客也是右侧固定宽度，左侧自适应屏幕的布局方式。 html代码： 实现方式方式有如下几种： 1.固定宽度区浮动，自适应区不设宽度而设置 margin 我们以右侧宽度固定，左侧宽度自适应为例： css代码： 实现 阅读全文
posted @ 2017-05-06 19:32 风雨后见彩虹 阅读(11409) 评论(0) 推荐(1) 编辑
2017年5月4日
CSS3效果：animate实现点点点loading动画效果（二）
摘要： box-shadow实现的打点效果 简介 box-shadow理论上可以生成任意的图形效果，当然也就可以实现点点点的loading效果了。 实现原理 html代码，首先需要写如下html代码以及class类名： css代码 这里用到了currentColor这个关键字，IE9+浏览器支持，其可以让C 阅读全文
posted @ 2017-05-04 08:50 风雨后见彩虹 阅读(3368) 评论(0) 推荐(1) 编辑
2017年5月2日
CSS3效果：animate实现点点点loading动画效果（一）
摘要： 实现如图所示的点点点loading效果： 一：CSS3 animation实现代码 html代码: css代码： 出现的就是如图所示的结果。注意点： 1.IE10+以及其他浏览器，点点点动画消失，IE6-IE9是普通的点点点文字。 2.animate动画是连续的，但是我们这儿是一帧一帧的，一卡一卡的 阅读全文
posted @ 2017-05-02 15:38 风雨后见彩虹 阅读(6041) 评论(0) 推荐(1) 编辑
2017年4月28日
你用过CSS3的这个currentColor新属性吗？使用与兼容性
摘要： currentColor顾名思意就是“当前颜色”，准确讲应该是“当前的文字颜色”，例如： currentColor表示“当前的标签所继承的文字颜色”，换种方式表示就是：currentColor = color的值。 凡事需要使用颜色值的地方，都可以使用currentColor替换，比方说背景色 – 阅读全文
posted @ 2017-04-28 09:06 风雨后见彩虹 阅读(4153) 评论(0) 推荐(0) 编辑
2017年4月25日
[转]Javascript实现图片的预加载详解
摘要： 下面的函数实现了一个我们想要的最基本的图片预加载效果 我们可以通过如下的方式加载我们想要的图片 上面的方法已经可以满足我们最基本的预加载图片的效果了，但情况往往并不如此，我们往往需要确切的知道图像是否被真正加载完成，并可能在后续执行一系列对图片的操作功能。幸运的是，这个功能实现起来并不难，我们可以使 阅读全文
posted @ 2017-04-25 11:12 风雨后见彩虹 阅读(1784) 评论(0) 推荐(1) 编辑
2017年4月13日
《JavaScript高级程序设计》笔记：变量、作用域和内存问题（四）
摘要： 基本类型和引用类型的值 ECMAScript变量可能包含两种不同数据类型的值：基本类型值和引用类型值。基本类型值指的是简单的数据段，而引用类型的值指那些可能有多个值构成的对象。 动态的属性 这说明只能给引用类型值动态添加属性。 复制变量值 num1中保存的值是5.当使用num1的值来初始化num2时 阅读全文
posted @ 2017-04-13 22:41 风雨后见彩虹 阅读(463) 评论(0) 推荐(1) 编辑
2017年4月12日
《JavaScript高级程序设计》笔记：基本概念（三）
摘要： 数据类型 ECMAScript中有5种简单数据类型（也称为基本数据类型）：undefined,null,boolean,number和string。 typeof typeof null会返回“object”。因为特殊值null被认为是一个空的对象引用。 undefined undefined类型只 阅读全文
posted @ 2017-04-12 08:54 风雨后见彩虹 阅读(461) 评论(0) 推荐(0) 编辑
2017年4月10日
jQ效果：jQuery之插件开发短信发送倒计时功能
摘要： 实现的主要功能如下： 1.点击按钮的时候，可以进行倒计时，倒计时自定义。 2.当接收短信失败后，倒计时停止，可点击重新发送短信。 3.点击的元素支持一般标签和input标签。 html代码： css代码： js代码： 调用方式： github地址：https://github.com/hxlmqti 阅读全文
posted @ 2017-04-10 12:54 风雨后见彩虹 阅读(756) 评论(0) 推荐(1) 编辑
上一页 1 ··· 6 7 8 9 10 11 12 13 14 ··· 16 下一页