01 2016 档案
摘要:时代在进步,网页前端界面也经历了各种设计革新,从最早简单的html网页到目前各种创意,创新的网站,简直让人眼花缭乱,但唯一不变的是网站内容,和良好的用户体验。下边为大家介绍多款增强用户体验的jquery插件。 1.Mobiscroll 对于许多开发者而言,Mobiscroll并不陌生,甚至可以说是相
阅读全文
摘要:现在已经有很多文章讨论jQuery和JavaScript的性能问题,然而,在这篇文章中我计划总结一些提升速度的技巧和一些我自己的建议来改善你的jQuery和JavaScript代码。更好的代码意味着更快的应用程序,快速渲染和反应性意味着一个更好的用户体验。 首先,我们要记住最重要的一点是:jQuer
阅读全文
摘要:在项目中加载jQuery的方式有很多种,下边为大家总结了几种,页面在加载的时候都会执行脚本,没有好坏之分哦,主要看习惯呢,本人觉得推荐二种方法,比较简洁,也是很多开发人员常用的哦。 第一种 $(document).ready(function(){ alert("第一种方法。"); }); 第二种
阅读全文
摘要:最近做的触屏版的项目中遇到监听input的值,使用keyup,手机上的键盘按下其它键没问题,但是删除键却监听不到,在网上找到下面的解决方法。 搜索框依据用户输入的值实时检索,一开始自然而然想到keyup,在拼音状态时,啥问题也没有, 问题1:切换到中文输入法,问题出来了,keyup事件不灵便了,后来
阅读全文
摘要:目前已经有很多html5播放器可以使用,使用html5播放器可以轻松的在页面中插入媒体视频,从而使我们的web页面变得更加丰富多彩,所以今 天向大家推荐一款非常优秀的html5播放器MediaElement.js,它不仅能够添加我们常用的html5视频格式(mp4,m4v,mov), 而且还支持回退...
阅读全文
摘要:本文的内容就是介绍淘宝弹性布局方案lib-flexible实践, 原理是通过js事实的检测屏幕的大小并改变html标签的字体大小,再结合rem的特性来完成页面的自适应。下面是flexible作者的说明。 https://github.com/amfe/article/issues/17 分享给大家供
阅读全文
摘要:在《CSS3 Transform——transform-origin》一文中主要介绍了CSS3 Transform属性中的transform-origin属性的使用,其实在transform属性中,transform-origin属性仅是其中之一,要彻底理解transform属性,这是不够的,必须的...
阅读全文
摘要:在CSS2.1中,我们的页面都是静态的,网页设计师也习惯把它作为页面效果的设计工具。但往往有些页面效果不只是静态的,比如说,如何实际移动一些元素?如何更改元素的外观——旋转或缩放?多年来,Web设计师为了给修改页面的外观,都依赖于图片、Flash或JavaScript才能完成。不过,CSS3将要改变...
阅读全文
摘要:作为一个网页设计师,你可能熟悉在二维空间工作,但是在三维空间上工作并不太熟悉。使用二维变形我们能够改变元素在水平和垂直轴线,然而还有一个轴沿着它,我们可以改变元素。使用三维变形,我们可以改变元素在Z轴位置。 三维变换使用基于二维变换的相同属性,如果您熟悉二维变换,你们发现3D变形的功能和2D变换的功...
阅读全文
摘要:在一个二维或三维空间,元素可以被扭曲、移位或旋转。只不过2D变形工作在X轴和Y轴,也就是大家常说的水平轴和垂直轴;而3D变形工作在X轴和Y 轴之外,还有一个Z轴。这些3D变换不仅可以定义元素的长度和宽度,还有深度。我们将首先讨论元素在2D平面如何变换,然后我们在进入3D变换的讨论。CSS3 2D变换...
阅读全文
摘要:一、简介content属性早在CSS2.1的时候就被引入了,可以使用:before以及:after伪元素生成内容。此特性目前已被大部分的浏览器支持:(Firefox 1.5+, Safari 3.5+, IE 8+, Opera 9.2+, Chrome 0.2+)。另外,目前Opera 9.5+ ...
阅读全文
摘要:看了下面网站的按钮效果,想自己也试试。http://tympanus.net/Development/CreativeLinkEffects/按照上面网站的效果实现。1.左右两侧出现边框的效果。相见代码如下:html代码: home project less代码:@charset "UTF-8...
阅读全文
摘要:一、简单说说content内容生成content内容生成就是通过content属性生成内容,content属性早在CSS2.1的时候就被引入了,可以使用:before以 及:after伪元素生成内容。此特性目前已被大部分的浏览器支持: (Firefox 1.5+, Safari 3.5+, IE 8...
阅读全文
摘要:一个普普通通的元素,如果应用了CSS3 transform变换,即便这个transform属性值不会改变其任何表面的变化(如scale(1), translate(0,0)),但是,实际上,对这些元素还是造成了写深远的影响。所谓表面无恙,内心奔溃的真实写照。以下就是自己列举的几个比较有代表性的表...
阅读全文
摘要:常常被人问及微信中使用的X5内核的问题,其实我也不是很清楚,只知道它是基于android 4.2的webkit,版本号是webkit 534。今天正好从X5团队拿到了一份问题汇总,梳理下发出来,给各位开发者以参考——不排除明天会删除这篇文章的可能。1.Android WebView常见问题及解决方案...
阅读全文
摘要:jQuery全屏滚动插件fullPage.js演 示 下 载简介如今我们经常能见到全屏网站,尤其是国外网站。这些网站用几幅很大的图片或色块做背景,再添加一些简单的内容,显得格外的高端大气上档次。比如 iPhone 5C 的介绍页面(查看),QQ浏览器的官网站。如果你也希望你的网站能设计成全屏的,显得...
阅读全文
摘要:贝塞尔曲线生成器CSS3属性中有关于制作动画的三个属性:Transform,Transition,Animation;我们一起学习完了Transform和Transition,让我们对元素实现了一些基本的动画效果,这些我想足以让大家激动了一阵子,今天我们趁着这个热劲继续第三个动画属性Animatio...
阅读全文
摘要:上一次大篇幅整理了CSS3中动画属性中的Transform,今天我们接着一起来看CSS3动画属性中的另一个属性Transition。W3C标准中对css3的transition这是样描述的:“css的transition允许css的属性值在一定的时间区间内平滑地过渡。这种效果可以在鼠标单击、获得焦点...
阅读全文
摘要:CSS3制作动画的几个重要属性有:变形(transform)、转换(transition)和动画(animation)等更高级的CSS3技术。本文主要介绍的是这三个属性之中的第一个──变形transform。Transform字面上就是变形,改变的意思。在CSS3中transform主要包括以下几种...
阅读全文
摘要:一、 input type=file与文件上传本文所说的input type=file指的是type类型是file的input元素,最简HTML代码如下:但是,为了习惯,我们多写成:在HTML5出现之前(XHTML),我们的闭合规则则有些出入:顾名思义,选择文件,并上传文件。在HTML5还没有出现之...
阅读全文
摘要:HTML5介绍HTML5是继HTML4以后的下一代HTML标准规范,它提供了一些新的元素和属性(例如网站导航块和)。新型的标签有利于搜索引擎和语义分析,同时更好地帮助小屏幕装置和视障人士使用,除此之外,也提供了一些新的功能,比如视频音频用的和,总结而言,有如下几大特点:取消了一些HTML4里过时的元...
阅读全文
摘要:前端的发展如此之迅猛,一不留神,大侠你可能就会被远远地甩在后面了。如果你不想被HTML5的改变/更新搅得不知所措的话,可以把本文的内容作为必须了解的热身课程。一、新的Doctype仍在使用麻烦的,不可能记得住的XHTML文档类型? 如果是,为什么还在用呢?使用新的HTML5文档类型代替吧。你会活得更...
阅读全文
摘要:1.作用域链javasrcipt的作用域链是很重要的一个环节,如果此处理解不好,在日后编写javascript就会造成很多不必要的麻烦。当然如果能够很好的理解它,那么javascript的闭包也能很好的理解了。在理解作用域链之前,首先要理解什么是作用域。作用域:直白点说,作用域就是变量和函数的访问范...
阅读全文
摘要:请看下面的代码,最后alert出来的是什么呢?var name = "Bob"; var nameObj ={ name : "Tom", showName : function(){ alert(this.name); }, waitSh...
阅读全文
摘要:现在介绍网页换肤的例子已经数不胜数,自己也没有仔细研究过,刚搞遇到类似这个问题,网上查了资料解决了问题,感觉很有用,就记录了下来和大家分享一下。效果很简单,我就直接讲怎么使用的。其中用到了jquery.cookie.js首先是html代码: Rainweb ...
阅读全文
摘要:前端实现页面垂直居中的几种思路:一、利用 position 和负边距利用绝对定位,让元素的顶部与居中线对齐,再让元素上移 50% 的高度。这个应该不难理解。原理可以用下图来做一个可视化说明:CSS代码 /* 代码实现: * 设定宽度和高度,父节点为 position:relative...
阅读全文
摘要:一、使用 opacity + Alpha Filter看起来手挺简单的吧?嗯。挺简单的… 希望你能很方便实现这个方案!其实见到这个的时候,我们的第一想法当然是 background + opacity,在不支持 opacity 的 IE 使用 filter 的 alpha 滤镜来实现。然后,我们得到...
阅读全文
摘要:常用meta整理 元素必要属性属性 值 描述 content some text 定义与http-equiv或name属性相关的元信息可选属性属性 http-equiv content-type / expire / refresh / set-c...
阅读全文

浙公网安备 33010602011771号