09 2012 档案

关于html不得不了解的知识
摘要：有这么一段HTML，请挑毛病：哥写的不是HTML，是寂寞。我说：不要迷恋哥，哥只是一个传说这是原来雅虎一道笔试题（文字变了变），用了很多年了，还没有一个人完全答对过。解答部分_________________出 这道题的动机是，太多人觉得HTML太简单，但它恰恰又是前端开发中最基础最重要的部分。HTML结构设计的合不合理，直接影响到代码易不易维护，灵不灵 活，同时事关网页性能，协作效率。碰到不少人认为前端开发就是javascript开发，大错特错啊。javascript, html, css这三个前端开发的基础支柱，性质完全不同又紧密关联，对它们的正确理解，合理应用是专业与非专业的区别。有些后 阅读全文
posted @ 2012-09-30 06:28 lines 阅读(366) 评论(1) 推荐(0) 编辑
Web2.0网站十五个显著的很受流行风格
摘要：1.简约2.居中布局3.不要过多使用竖列布局4.页面头部和主体有所分离5.明显的区域分界6.简约的导航栏7.粗体字的LOGO8.文本大些9.更大的内容主题和简介文字10.明亮、强烈的颜色11.3D质感12.使用渐变色13.高光和投影14.精美的ICON15.多角星标签简短的介绍和图片，列举出Web2.0网站十五个显著的流行风格要素。不必在一个设计中应用下列所有的元素，掌握何时用和如何使用才是关键。... 阅读全文
posted @ 2012-09-29 06:24 lines 阅读(758) 评论(0) 推荐(0) 编辑
图片垂直居中的使用技巧
摘要：“使用纯CSS实现未知尺寸的图片(但高宽都小于200px)在200px的正方形容器中水平和垂直居中。”当然出题并不是随意，而是有其现实的原因，垂直居中是网站建设中工作中最常遇到的一个问题，很有代表性。题目的难点在于两点：垂直居中；图片是个置换元素，有些特殊的特性。至于如何解决，下面是一个权衡的相对结构干净，CSS简单的解决方法：.box {/*非IE的主流浏览器识别的垂直居中的方法*/display: table-cell;vertical-align:middle;/*设置水平居中*/text-align:center;/* 针对IE的Hack */*display: block;*font 阅读全文
posted @ 2012-09-28 06:20 lines 阅读(227) 评论(0) 推荐(0) 编辑
javascript节点的操作 创建、添加、移除、移动、复制
摘要：（1）创建新节点createDocumentFragment() //创建一个DOM片段createElement() //创建一个具体的元素createTextNode() //创建一个文本节点（2）添加、移除、替换、插入appendChild()removeChild()replaceChild()insertBefore()（3）查找getElementsByTagName() //通过标签名称getElementsByName() //通过元素的Name属性的值getElementById() //通过元素Id，唯一性本节要用到的html例子项目一项目二项目三1.创建元素节点docum 阅读全文
posted @ 2012-09-27 06:01 lines 阅读(7513) 评论(0) 推荐(1) 编辑
js获取窗口大小
摘要：常用:JS 获取浏览器窗口大小 1 // 获取窗口宽度 2 if (window.innerWidth) 3 winWidth = window.innerWidth; 4 else if ((document.body) && (document.body.clientWidth)) 5 winWidth = document.body.clientWidth; 6 // 获取窗口高度 7 if (window.innerHeight) 8 winHeight = window.innerHeight; 9 else if ((document.body) && 阅读全文
posted @ 2012-09-26 09:49 lines 阅读(1851) 评论(0) 推荐(0) 编辑
跟随鼠标移动-实例
摘要：1 2 3 4 5 跟随鼠标移动实例 6 19 20 21 22 23 24 25 35 阅读全文
posted @ 2012-09-26 09:47 lines 阅读(271) 评论(0) 推荐(0) 编辑
常用前端开发工具合集
摘要：1.Firebughttp://getfirebug.com/最流行的前端开发工具2.HttpWatchhttp://www.httpwatch.com/集成在IE和Firefox上的监听HTTP和HTTPS的工具3.Fiddlerhttp://www.fiddler2.com/fiddler2/Fiddler是一个记录你电脑和网络之间所有HTTP(S)请求的网络调试代理4.HttpFoxhttps://addons.mozilla.org/eu/firefox/addon/6647?lang=en-US和HTTPWatch很类似的一个工具5.Yslowhttp://developer.yah 阅读全文
posted @ 2012-09-26 06:58 lines 阅读(201) 评论(0) 推荐(1) 编辑
35套实用精美的免费网页按钮附带PSD源文件
摘要：按钮是网页最重要的组成部分之一，是用户和网站交互的桥梁。Form Message ButtonsSimple Web ButtonsToggle Switch ButtonGlossy Web 2.0 ButtonRed Call to Action ButtonPretty Round ButtonsSimple Web ButtonCall to action buttonRed Downlo... 阅读全文
posted @ 2012-09-25 06:56 lines 阅读(205) 评论(0) 推荐(0) 编辑
11个惊人的CSS3和jQuery教程
摘要：引进CSS3带来了很多令人兴奋的Web开发行业。CSS 3D变换的支持下，在以前是不可能的，这是可能的。CSS3只是一个造型技术在网页设计中常用的，但引进的动画性能和3D转换属性，我们可以很容易地创建很酷的动画，加上相结合的Javascript，令人惊艳的效果！在这篇文章中，我们已经收集了11 CSS3相关的教程，告诉你如何做出令人惊艳的效果，一些experimentals，但放心，这是CSS的未... 阅读全文
posted @ 2012-09-24 06:55 lines 阅读(237) 评论(0) 推荐(0) 编辑
SVG是什么？SVG有什么用途？
摘要：一、SVG技术背景随着网络上信息数据的大量涌现，如何正确显示和出版是有效传输、接收和利用它们的基础。图形、图像是信息数据可视化的主要方式。但现有的图形、图像格式 存在着缺陷：非开放式，显示和印刷质量及适应性差，难以创建Web上图文信息的个性化定制、交互式以及实时动态方面的应用等。SVG正是在这样的背景下诞 生的。SVG(Scalable Vector Graphics，可伸缩性矢量图形)是由万维网联盟(W3C)推出的基于XML编码的开放式图形、图像标准。它虽然是一种二维矢量图形格式，但其中可以 包含矢量图形、光栅图像及文本等。这种新的图形格式不但拥有Web矢量图形的固有特性，更是结合了XML及 阅读全文
posted @ 2012-09-23 06:20 lines 阅读(3406) 评论(0) 推荐(1) 编辑
jquery 截取超长文本
摘要：最近在做项目的时候，遇到了诸多问题，现在这个方法能有效截取带有描述性的文本放到容器中撑开的问题。[task]jquery 截取超长文本请按F5刷新页面。。。。计算字串的长度长度长度长度这边有优化很公开这边这边有优化很公开长度长度很公开长度计算字长度长度这边有优化很边有优化很边有优化很边有优化很边有优化很[/task] 阅读全文
posted @ 2012-09-22 22:59 lines 阅读(321) 评论(0) 推荐(0) 编辑
APP界面设计欣赏
摘要：话不多说，直接上图！~~~以上图片的来源http://www.uimaker.com 阅读全文
posted @ 2012-09-22 18:22 lines 阅读(242) 评论(0) 推荐(0) 编辑
手机网站新模式-3G门户HTML5概念版
摘要：现在手机网站大部分还是沿用传统PC网站模式，无法体现出手机的特性体验也会较差，所以大部分人会选择APP软件浏览资讯，但下载APP、版本更新、流量等成本是用户需要承受的。随着HTML5的技术发展，手机网站已经可以接近APP软件的体验和功能，而且还有独有的优势，3G门户概念版是国内首个基于HTML5技术的综合资讯移动WebAPP网站，未来移动互联网站的趋势 ，（手机输入app.3g.cn）他的特点是速... 阅读全文
posted @ 2012-09-21 18:21 lines 阅读(1072) 评论(0) 推荐(0) 编辑
触屏手机网站-炫版交互设计
摘要：触屏手机网站和非触屏手机网站区别在于，前者使用手指点击注重点击体验， 而后者是使用手机物理按键注重选取规则，触屏手机屏幕增大，可以显示更多的内容，但内容密度不宜过大否则不便点击，一般人的食指点击的区域约为7*7 mm 拇指点击区域约为8*8 mm，各大门户也分别推出适应触屏手机的高端版本，下面将会从手机网站最常使用的二个交互功能来分析3G门户炫版和其他门户的区别。手机网站常用交互功能之一“信息连接... 阅读全文
posted @ 2012-09-20 17:35 lines 阅读(309) 评论(0) 推荐(0) 编辑
iscroll典型的实例
摘要：这是关于iscroll，比较典型的实例demo。感兴趣的话，自己可以试试...[task]点击向左边点击向右边左右左右左右左右左右左右左右左右左右左右左右左右12//这里需要引入iscroll这个插件的文件[/task] 阅读全文
posted @ 2012-09-19 17:14 lines 阅读(473) 评论(0) 推荐(0) 编辑
支付宝盖印效果demo
摘要：一个支付宝盖印效果,点击demo[task][/task] 阅读全文
posted @ 2012-09-18 20:02 lines 阅读(273) 评论(0) 推荐(0) 编辑
体现重力的谷歌创意页面
摘要：谷歌创意页面，这个页面体现了重心引力。效果不错，不过如果再对google这几个字母进行修饰下，效果估计会更好。查看demo 阅读全文
posted @ 2012-09-17 20:37 lines 阅读(201) 评论(0) 推荐(0) 编辑
使用负边距创建自适应宽度的流体布局
摘要：随着越来越大的浏览器的出现及普及，网站界面如何能满足不同分辨率浏览器使用者的浏览需求，逐渐成为前端开发工程师必须面对的问题。目前国内门户很多都进行了改版，采用目前的主流–960px左右的宽度。我认为，对于不太复杂的网站，采用百分比进行架构是个不错的主意。自适应布局的应用面还是蛮多的，比如论坛页面、博客页面等。以往我们进行这类架构都是使用table表格。但，其实使用很小的技术就可以创建出符合WEB标... 阅读全文
posted @ 2012-09-16 09:33 lines 阅读(294) 评论(0) 推荐(0) 编辑
javascript：多重条件判断
摘要：javascript 是一门精巧的语言，可大可小，可伸可缩，如意金箍棒一般，运用恰当，可敌千夫。比如一个场景，有的人要写上百行代码，但是有的人寥寥几笔即可实现，思路就在弹指间。要想学好一门语言，就要掌握其要义，归纳其精髓，方可如鱼得水，运筹帷幄。js在开发大型组件库的时候经常会碰到很多的逻辑分支情况。比如博客园的编辑框编写：[task]if(target === "font"){ someFun... 阅读全文
posted @ 2012-09-15 17:57 lines 阅读(1478) 评论(0) 推荐(0) 编辑
延时弹出层控制
摘要：[task] 延时弹出层控制 文字1 这个都是测试写的 文字2 这个都是测试写的 文字3 这个都是测试写的 弹出层的内容 弹出层的内容 弹出层的内容 弹出层的内容 关闭 [/task] 阅读全文
posted @ 2012-09-14 17:42 lines 阅读(200) 评论(0) 推荐(0) 编辑
市面上主流屏幕分辨率
摘要：下面信息包括屏幕分辨率、宽高比、ppi、aspect ratio、css pixel ratio等，对我们开发面向移动终端的网站比如响应式设计可以提供比较全面的参考信息。这里不多罗列，直接访问维基百科的页面吧~~ 阅读全文
posted @ 2012-09-13 17:38 lines 阅读(408) 评论(0) 推荐(0) 编辑
微博首页简单的滚动效果
摘要：一个简单的微博首页动态信息滚动效果[task]微博首页简单的滚动效果 微博首页简单的滚动效果 微博首页简单的滚动效果1 微博首页简单的滚动效果2 微博首页简单的滚动效果3 [/task] 阅读全文
posted @ 2012-09-12 20:04 lines 阅读(280) 评论(0) 推荐(0) 编辑
图片展示javascript各类型的关系
摘要：这个图来自于《JavaScript语言精髓与编程实践》第三章P184页。此外，补充一下图中用到的概念：1、内置（Build-in）对象与原生（Naitve）对象的区别在于：前者总是在引擎初始化阶段就被创建好的对象，是后者的一个子集；而后者包括了一些在运行过程中动态创建的对象。2、引擎扩展对象是一个并不太大的集合，一般来说比较确定，它们也属于引擎的原生对象（但不属于ECMA规范的原生对象）。3、宿主... 阅读全文
posted @ 2012-09-11 08:41 lines 阅读(252) 评论(0) 推荐(0) 编辑
js代码小技巧
摘要：1. 将彻底屏蔽鼠标右键[task]oncontextmenu="window.event.returnvalue=false"no 可用于Table[/task]2. 取消选取、防止复制[task][/task]3.不准粘贴[task]onpaste="return false"[/task]4. 防止复制[task]oncopy="return false;" oncut="return f... 阅读全文
posted @ 2012-09-07 20:02 lines 阅读(223) 评论(0) 推荐(0) 编辑
js广告随窗口滚动-小案例
摘要：[task]两侧广告条幅随窗口滚动[/task] 阅读全文
posted @ 2012-09-07 08:40 lines 阅读(254) 评论(0) 推荐(0) 编辑
js缓冲效果原理
摘要：[task]js缓冲效果原理[/task] 阅读全文
posted @ 2012-09-06 19:30 lines 阅读(153) 评论(0) 推荐(0) 编辑
那些带给我们强烈视觉冲击的JavaScript特效网站
摘要：关于 HTML5 和 Flash 之间的战争，网上讨论的文章很多很多，尽管HTML5还有很长的路要走，但 Flash 正在走下坡路是不争的事实。以前效果精美的 Flash 网站非常流行，如今已经很少见到了。借助JavaScript，使用纯HTML/CSS就可以实现媲美 Flash 的精美网站。建议使用支持html5的火狐或谷歌、opera浏览器，获得更好的体验！Black Negative太炫了... 阅读全文
posted @ 2012-09-05 20:01 lines 阅读(264) 评论(0) 推荐(0) 编辑
jquery弹出层
摘要：这是一个弹出层的插件，有时候做东西的，经常会用到了，所以在次发一下，和大家分享一下！[task]lyz.layer1.0弹层插件API这是一个用于弹出的层关闭实例演示示例最简洁的调用备注提示信息$.alert({ msg: "这是调用$.alert弹出信息" });专有属性：msg(可选)、callback(可选)成功信息$.right();专有属性：msg(可选)、callback(可选)错误信... 阅读全文
posted @ 2012-09-05 13:22 lines 阅读(387) 评论(0) 推荐(0) 编辑
CSS中Float概念相关文章
摘要：float 是 css 的定位属性。在传统的印刷布局中，文本可以按照需要围绕图片。一般把这种方式称为“文本环绕”。在网页设计中，应用了CSS的float属性的页面元素就像在印刷布局里面的被文字包围的图片一样。浮动的元素仍然是网页流的一部分。这与使用绝对 定位的页面元素相比是一个明显的不同。绝对定位的页面元素被从网页流里面移除了，就像印刷布局里面的文本框被设置为无视页面环绕一样。绝对定位的元素不会 ... 阅读全文
posted @ 2012-09-04 19:57 lines 阅读(166) 评论(0) 推荐(0) 编辑
HTML5-本地存储 Web留言板
摘要：[task]HTML5--JS API-本地存储 Web留言板HTML5--JS API-本地存储 Web留言板[/task] 阅读全文
posted @ 2012-09-03 08:40 lines 阅读(855) 评论(0) 推荐(0) 编辑
DD_belatedPNG解决IE6下PNG不透明问题
摘要：众所周知IE6不支持透明的PNG图片,而PNG图片在Web设计方面表现力上，具有其它图形格式所达不到的效果，IE6这一致命缺陷极大地限制了Web设计的创意发挥。虽然解决IE6的透明PNG的方法也很多,从使用IE特有的滤镜或是e­xpression,再到javascript+透明 GIF替代.但是这些方法都有一个缺点,就是不支持CSS中backgrond-position与background-re... 阅读全文
posted @ 2012-09-02 16:47 lines 阅读(200) 评论(0) 推荐(0) 编辑

点击右上角即可分享
微信分享提示