susubanana - 博客园

2012年10月12日

摘要：显示属性displaylist-styleposition* top,right,bottom,left* z-indexfloatclear自身属性widthheight* overflow* zoommarginpaddingborderbackground文本属性colorfonttext-decoration* text-indenttext-alignvertical-align* line-heightwhite-spacecontent 阅读全文

posted @ 2012-10-12 17:53 susubanana 阅读(106) 评论(0) 推荐(0) 编辑

div+css实现带三角箭头提示框

摘要： div+css实现带三角箭头提示框带三角箭头的提示框，就是下面所示：这是一个提示框通常我们都用图片来实现上面那个小三角，因为这样方便快速，但是如果图片处理得不好，会看起来有杂边，从而影响视觉，所以换一种思路来解决。首先来研究一下CSS是如何实现三角形的。假定有一个盒子(div)，给定宽高分别为100像素，再给定边框50像素，那么它看起来会是下面这个样子(为了更直观，给了边框四种不同的颜色)：接下来，把盒子的高度设为0：再把宽度也设为0：这样雏形就已经出来了，由于IE6的bug(高度为0的div会有一定默认的高度，我的电脑上测量结果为19像素)，需要做一些小调整，给div加一个overflow: 阅读全文

posted @ 2012-10-12 17:47 susubanana 阅读(932) 评论(0) 推荐(0) 编辑

2012年8月16日

分享十个预加载功能生成器

摘要：几乎所有经常大量使用图片展示的网站都对针对图片加载执行了一些有效的优化步骤，然而，并不是任何情况都能指望这样做。有时候你的确需要加载非常大的图片，而最后结果往往是图片加载过慢导致页面本身没有加载完整。因此考虑使用一些不错的jQuery插件帮助你异步加载图片以优化页面加载速度往往是一个不错的选择！Queryloader v2Queryloader v2简单的扫描指定元素的图片，并且在网站显示之前加载相关图片。JAIL JAML是一个异步的图片加载的插件，这个插件非常小（压缩版本仅4Kb ），非常小但是很强大。非常适合去加载大尺寸的图片。优化用户使用体验，主要的实现方式是在页面加载后再加载图片阅读全文

posted @ 2012-08-16 17:05 susubanana 阅读(287) 评论(0) 推荐(0) 编辑

easy Html5 - Jquery Mobile之Buttons

摘要：简介Button在移动应用中使用频率较高，而且功能丰富；即可用作ui显示内容，同时可以指导用户点击从而实现各种逻辑的交互；而且在一些比较好的应用里的button不仅有了各种行为和样式，还将其作为透明层来增强效果和体验；jquery mobile中button也是一种核心组件，它在其他组件中的到了高频次的应用；比如前一篇中的Navigation Bar及各种toolbars都是基于button来处理的；只是在jquery mobile中的button却不仅限于form中的type=button的标签；比如导航链接其实就是一个<a></a>标签，但是它却可以拥有和but 阅读全文

posted @ 2012-08-16 10:28 susubanana 阅读(1456) 评论(0) 推荐(1) 编辑

2012年5月3日

用JavaScript实现可复用性的文字闪烁的效果

摘要：以下为JSP页面：<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%><!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"><html lang="zh-CN" xml:lang="zh-CN& 阅读全文

posted @ 2012-05-03 09:56 susubanana 阅读(518) 评论(0) 推荐(0) 编辑

2012年4月15日

苦逼程序员

摘要： 1.程序员有时候加班闷了，会临时夜里回趟家，随便赶上哪个IDE就用哪个IDE，比如Eclipse，独自趴在电脑前写一夜代码，不发一语，第二天清晨再回到公司，当没事发生过，突然觉得这TM才叫生活。2.宝宝数学很好。2岁就可以从1数到10了。后来，我告诉他0比1还小。今天吃饺子，我说：“宝宝，你数数你想吃几个饺子？“0,1,2,3....”一边说着一边拿起一个饺子，“这是第0个”老婆怒吼：“下一代还是做码农的命！”3.惊闻铁道部搭建12306.cn山寨网站共花费1685万，管理员本着吐槽的精神猜测资金是这样分配的——1685万，领导拿了1600万，公司拿了80万，公司从某高校找了个合作实验室，给了阅读全文

posted @ 2012-04-15 20:25 susubanana 阅读(1207) 评论(1) 推荐(2) 编辑

2012年4月7日

对象检测和浏览器检测

摘要：对象检测是避免浏览器问题的最佳助手。不依赖浏览器种类和版本，依赖浏览器能力，一旦知道访问者的浏览器支持某些对象，就能安全启动脚本。 function isCompatible(other) { // 使用能力检测来检测是否支持某些对象 if( other===false || !Array.prototype.push || !Object.hasOwnProperty || !document.createElement || !document.getElementsByTagName ) { alert('TR- if you see this mes... 阅读全文

posted @ 2012-04-07 11:44 susubanana 阅读(222) 评论(0) 推荐(0) 编辑

2012年4月6日

增强网站可访问性（转）

摘要：增强网站可访问性的25种方法随着web使用量的增加和人们网络意识的增强，可访问性（或“通用设计”）变得更加重要。可访问性不仅取决于一个网站的代码，还受网站设计和内容的影响，这就是为什么可访问性、标准和可用性关系如此紧密。网页无障碍是一个庞大的课题，已自成一个领域。但不要被它吓到。无障碍并不是非常难以实施。它并不会像一些人想象的会有碍美观或影响交互。这是一种高明的（smart）设计和开发方式。让我们来看看建立一个无障碍网站的25个重要技术。1.一致的布局和结构为了帮助用户快速和轻松地浏览您的网站，你应该提供一个一致的布局和结构。页面的主要元素——banner、navigation、sideba 阅读全文

posted @ 2012-04-06 23:49 susubanana 阅读(342) 评论(0) 推荐(0) 编辑

web性能优化：将link样式表放在顶部，将script脚本放在底部

摘要：将CSS样式表包含在文档中，外部引用CSS的两种方式：使用LINK标签和@import规则。使用link标签的实例：<link rel="stylesheet" href="styles1.css">带有@import规则的style标签实例：<style> @import url("styles2.css")</style>link标签除了语法简单外，使用link标签能带来性能上的收益，@import规则有可能会导致白屏现象（就是页面加载的时候，页面空白，或者闪烁），因为@import是引用的CS 阅读全文

posted @ 2012-04-06 19:11 susubanana 阅读(1114) 评论(0) 推荐(0) 编辑

2012年3月31日

ajax会破坏网站

摘要： ajax，不易访问性；多个请求竞争去做同一件事；跨站点安全限制，ajax还会经常破坏浏览器产品功能，例如后退按钮和书签等用户离不开或者期望以某种方式运行的功能。对应用Ajax最主要的批评就是，它可能破坏浏览器后退按钮的正常行为。在动态更新页面的情况下，用户无法回到前一个页面状态，这是因为浏览器仅能记下历史记录中的静态页面。一个被完整读入的页面与一个已经被动态修改过的页面之间的差别非常微妙；用户通常都希望单击后退按钮，就能够取消他们的前一次操作，但是在Ajax应用程序中，却无法这样做。不过开发者已想出了种种办法来解决这个问题，当中大多数都是在用户单击后退按钮访问历史记录时，通过建立或使用一个隐藏阅读全文

posted @ 2012-03-31 00:28 susubanana 阅读(178) 评论(0) 推荐(0) 编辑

公告