NANA

作者:hbjswj 日期:2010-02-05

十几个小时看完了.是一部不错的青春爱情部分现实动画.
经典台词:
1、男人与女人终究也只是欲望的动物吧，真的可以因为爱而结合吗？
2、章司对奈奈说的：“现在想想，其实你的任性，也没有什么不好的。”
3、没有一个人完全属于另一个人。
4、不管在怎样的人潮之中，不管你做何种的打扮，我都有自信找得到你。所以，不管是多么悲伤的日子，我都不会低着头走路，因为我在寻找的那个终点，就在她的手里。
5、奈奈要和伸夫拍拖的时候想的话：“什么都不用想，因为在这里有我想要的全部的未来。”
6、并不是只要把真心话说出来就可以互相了解的。
7、如果我们是一对情人，我们之间的距离是不是只要一个拥抱就能填满呢？还是说，每个人都无法排解这份寂寞呢？
8、就算再痛苦，只要活着，一定会有好事！
9、那时的我，觉得娜娜周遭的世界，散发着耀眼的光芒。我不是随便什么人都好，我只想进入相同的光芒之中。
10、你大概没有发觉吧，你的一举一动，都跟现在的台风一样，威力十足，扰乱着我的心情，我就像初尝恋爱滋味的少年一样，情绪高涨得，快要决堤了。
11、人总会有一个忘不了的人，但是人生还很长，如果为了这一点小事就介怀不已，那麽人还用生活吗？

Tags: NANA NANA 奈奈奈奈娜娜娜娜

分类:琐事杂谈 | 固定链接 | 评论: 1 | 引用: 0 | 查看次数: 19

通宵记:竹刀少女

作者:hbjswj 日期:2010-02-03

一部不错的热血动漫,讲述了人如何战胜困难.
看完都想去了解这运动,情节不是很跳,有时也很搞笑.
级数(26级)并不多,是一部不错的动漫.(11个小时看完)

youku的观看地址:http://www.youku.com/playlist_show/id_739244.html
pps的观看地址:http://bk.pps.tv/ct202568567/
还是动漫有爱啊.

Tags: 竹刀少女竹刀少女热血动漫热血动漫

分类:短片 | 固定链接 | 评论: 0 | 引用: 0 | 查看次数: 22

祝大家新年快乐

作者:hbjswj 日期:2010-02-01

好久没有涂了.练习一张

Tags: 涂鸦涂鸦虎年快乐虎年快乐 2010 2010

分类:涂鸦图片 | 固定链接 | 评论: 0 | 引用: 0 | 查看次数: 25

DOM 部分小结

作者:hbjswj 日期:2010-01-30

1.访问文档中无素
  document.getElementById('id'):获取给定id的元素,并将其作为对象.
  document.getElementsByTagName('tagname'):获取所有标签名为tagname的元素,并把它保存在一个类似数组的列表中.

2.读取元素的属性,节点值及其他节点数据
  node.getAttribute('attribute'):获取属性名为attribute的值.
  node.setAttribute('attribute','value'):设置属性名为attribute的值为value.
  node.nodeType:读取节点类型(1=元素,3=文本节点...).
  node.nodeName:读取节点名称(元素名字或#textNode).
  node.nodeValue:读取或设置节点的值(文本节点的情况下则为文本内容).

3.节点之间操作
  node.previousSibling:获取上一个兄弟节点,并将它保存为一个对象.

Tags: javascript javascript DOM资料 DOM资料

分类:前端技术 | 固定链接 | 评论: 0 | 引用: 0 | 查看次数: 30

JavaScript可访问性

作者:hbjswj 日期:2010-01-26

可访问的JavaScript必须做到以下几点:
1.在拥有和没有JavaScript的情况下,网页文档应该具有相同的内容---访问者不应该必须关闭或必须打开JavaScript(国为访问者是否能够打开JavaScript经常不由自己决定).

2.如果存在只有当JavaScript可用的时候才有意义的内容或者HTML元素,那么这些内容或者元素必须是由JavaScript创建的.没有什么比一个链接什么都不做或者一个文本所解释的功能对你不可用更让人沮丧的了.

3.所有的JavaScript功能应该是独立于输入设备的.比如,用户可以使用拖放界面,也可以通过单击或是按钮的方法来激一个页面元素.

4.网页中非交互性元素(实际上除了链接和表单元素外都不应该是)不应该变成交互性的----除非你提供了备用方案.例如,对于能使其后面的文本折叠或者展开的大字标题,虽然用JavaScript你可以轻易地使它变成可单击的,但这也意味着只能使用键盘的客户将永远无法使用这一功能.如果你在大字标题中创建了一个链接并使其可单击,那么用户应该能够通过"TAB"移到这个链接并按下"回画"来激活这个效果.

5.脚本不应该自动地将用户重定向到其他页面或是在未与用户交互的情况下提交表单.这是为了避免不完整的表单提交---因为一些辅助技术在处理onchange事件上存在问题.此外,病毒和间谍软件可以通过JavaScript将用户转到其他页面.因此这已经被一些软件所禁止.
文章来源《深入浅出JavaScript》

Tags: javascript javascript 可访问性可访问性

分类:前端技术 | 固定链接 | 评论: 0 | 引用: 0 | 查看次数: 38

CSS图片放大样式

作者:hbjswj 日期:2010-01-25

关键是后面2句CSS,偶把CSS还给书本了-_-!
学习参照牛人的CSS
下载文件

点击下载此文件

HTML代码

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>css图片样式</title>
<style type="text/css">
html,body{margin:0;padding:0;text-align:center;background-color:#C8DDD8;}

.con{margin:0 auto;width:960px;position:relative;height:auto;}

.con ul{list-style:none;margin:0;padding:0;}

.con ul li{display:inline;}

.con ul li a{width:181px;height:218px;display:block;text-decoration:none;cursor:default;float:left;}
.con ul li a img{width:161px;height:208px;display:block;border:5px solid #FCFACD;}

.con ul li a:hover{position:relative;}
.con ul li a:hover img{position:absolute;width:225px;height:291px;left:-27px;top:-40px;display:block;}
</style>
</head>
<body><br /><h3>Rock</h3>
<div class="con">
<ul class="aa">
<li><a href="#"><img src="http://www.orcss.com/attachments/month_0908/l20098269820.jpg" title="1" /></a></li>
<li><a href="#"><img src="http://www.orcss.com/attachments/month_0908/l20098269820.jpg" title="2" /></a></li>
<li><a href="#"><img src="http://www.orcss.com/attachments/month_0908/l20098269820.jpg" title="3" /></a></li>
<li><a href="#"><img src="http://www.orcss.com/attachments/month_0908/l20098269820.jpg" title="4" /></a></li>
<li><a href="#"><img src="http://www.orcss.com/attachments/month_0908/l20098269820.jpg" title="5" /></a></li>
</ul>
</div>
</body>
</html>

[Ctrl+A 全部选择提示：你可先修改部分代码，再按运行]

Tags: CSS图片放大样式 CSS图片放大样式

分类:前端技术 | 固定链接 | 评论: 0 | 引用: 0 | 查看次数: 54

解决IE6下PNG透明问题(DD_belatedPNG)

作者:hbjswj 日期:2010-01-19

详细文档见http://dillerdesign.com/experiment/DD_belatedPNG/
使用方法很简单，首先下载调用JS
0.0.8a.js (未压缩版本, ~12Kb)
0.0.8a-min.js (压缩版, ~7Kb)
之后在使用PNG的页面中引用代码
<!–[if IE 6]>
<script type=”text/javascript” src=”下载下来的JS路径”></script>
<script>
DD_belatedPNG.fix(’CSS选择器, 应用类型’);
</script>
<![endif]–>
引用函数是 DD_belatedPNG.fix() , 括号里分别填写应用PNG的CSS选择器（可使用ID选择器和类选择器）和应用类型（分为img和background两种）。
如DD_belatedPNG.fix(’#box-one, img’) 或者 DD_belatedPNG.fix(’.header, background’) 等。

分类:前端技术 | 固定链接 | 评论: 0 | 引用: 0 | 查看次数: 44

笑红尘 -王雅洁爵士版

作者:hbjswj 日期:2010-01-15

播放音频文件

在线播放

非本站音乐,地址过期请点击这里:笑红尘
笑红尘
红尘多可笑
痴情最无聊
目空一切也好

此生未了
心却已无所扰
只想换得半世逍遥
醒时对人笑
梦中全忘掉
叹天黑得太早

Tags: 笑红尘笑红尘王雅洁王雅洁爵士爵士

分类:音乐 | 固定链接 | 评论: 0 | 引用: 0 | 查看次数: 65

ie6下的字体BUG

作者:hbjswj 日期:2010-01-14

文章来自网络.

HTML代码

<!doctype html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gbk">
<title>Web Default Font</title>
</head>
<body>

<p style="font: 12px tahoma;">The quick brown fox jumps over the lazy dog. <a href="">下划线测试 english text</a> 1234567890 ,.?!:''" ，。？！：；‘“”’…… []{}()<>|/\`~@#$%^&*-+=© font: 12px tahoma;</p>
<p style="font: 12px arial;">The quick brown fox jumps over the lazy dog. <a href="">下划线测试 english text</a> 1234567890 ,.?!:''" ，。？！：；‘“”’…… []{}()<>|/\`~@#$%^&*-+=© font: 12px arial;</p>
<p style="font: 12px helvetica;">The quick brown fox jumps over the lazy dog. <a href="">下划线测试 english text</a> 1234567890 ,.?!:''" ，。？！：；‘“”’…… []{}()<>|/\`~@#$%^&*-+=© font: 12px helvetica;</p>
<p style="font: 12px \5b8b\4f53;">The quick brown fox jumps over the lazy dog. <a href="">下划线测试 english text</a> 1234567890 ,.?!:''" ，。？！：；‘“”’…… []{}()<>|/\`~@#$%^&*-+=© font: 12px \5b8b\4f53;</p>
<hr />

<h2>Tahoma 的问题</h2>

<h3>1) 下划线粘贴问题</h3>
<p style="font: 12px Tahoma;"><a href="">所有浏览器里，下划线都会紧紧贴住中文字，很难看。font: 12px tahoma;</a></p>
<ul><li style="font: 12px tahoma;"><a href="">IE6 下，如果链接在 li 元素里，则不会粘，显示得很好。（究竟是为什么呢？除了 li, 还有什么元素有此疗效？） font: 12px tahoma;</a></li></ul>

<h3>2) 13px 中文显示问题</h3>
<p style="font: 12px tahoma;">在 IE6 里，13px 的中文很难看。其它浏览器会用 12px 来显示。font: 12px tahoma;</p>
<p style="font: 13px tahoma;">在 IE6 里，13px 的中文很难看。其它浏览器会用 12px 来显示。font: 13px tahoma;</p>
<p style="font: 14px tahoma;">在 IE6 里，13px 的中文很难看。其它浏览器会用 12px 来显示。font: 14px tahoma;</p>

<h3>3) 中英文混排问题</h3>
<p style="font: 12px tahoma;"><a href="">如果一行里同时出现中文和英文，且这一行里有元素被定义了 <span style="vertical-align: top;">vertical</span>-align 属性，在IE6-8 里会导致文字高低不齐，甚至下划线错位。font: 12px tahoma;</a></p>
<p style="font: 12px tahoma;zoom: 1">zoom: 1 触发 hasLayout <strong>不能</strong>解决所有问题。 <a href="">中文与英文混排 <span style="vertical-align: top;">vertical</span>-align。font: 12px tahoma;</a></p>
<hr />

<h2>Arial 的问题</h2>

<h3>1) 下划线粘贴问题</h3>
<p style="font: 12px arial;"><a href="">除了 IE6, 其它所有浏览器里，下划线都会紧紧贴住中文字，很难看。font: 12px arial;</a></p>

<h3>2) 13px 中文显示问题</h3>
<p style="font: 12px arial;">在 IE6 里，13px 的中文显示比 Tahoma 好，但依旧有点怪。其它浏览器会用 12px 来显示。font: 12px arial;</p>
<p style="font: 13px arial;">在 IE6 里，13px 的中文显示比 Tahoma 好，但依旧有点怪。其它浏览器会用 12px 来显示。font: 13px arial;</p>
<p style="font: 14px arial;">在 IE6 里，13px 的中文显示比 Tahoma 好，但依旧有点怪。其它浏览器会用 12px 来显示。font: 14px arial;</p>

<h3>3) 中英文混排问题</h3>
<p style="font: 12px arial;"><a href="">如果一行里同时出现中文和英文，且这一行里有元素被定义了 <span style="vertical-align: top;">vertical</span>-align 属性，在IE6-8 里会导致文字高低不齐，<strong>IE6 里下划线不会错位</strong>，IE7-8 里下划线错位。font: 12px arial;</a></p>
<p style="font: 12px arial;zoom: 1">zoom: 1 触发 hasLayout <strong>不能</strong>解决所有问题。 <a href="">中文与英文混排 <span style="vertical-align: top;">vertical</span>-align。font: 12px arial;</a></p>
<hr />

<h2>Helvetica 的问题</h2>

<h3>1) 找不到时，漠视第二字体</h3>
<p style="font: 12px helvetica,tahoma;">[] 用 font: 12px helvetica,tahoma; 定义字体时，在 XP / Win7 等操作系统中，如果没有安装 helvetica 字体，会直接调用默认字体，而不是排在第二的 tahoma.</p>
<p style="font: 12px helvetica2,tahoma;">[] 恼人的是，用 font: 12px helvetica2,tahoma; 定义字体时，会调用排在第二的 tahoma. 浏览器的世界，啥都有可能。</p>
<p style="font: 12px xxx,tahoma;">[] 或者 font: 12px xxx,tahoma; 一切正常。<strong>helvetica 进了某个秘密名单？</strong></p>

<h3>2) 非 Mac 下的 Helvetica 都是 Rip 版，效果不是很好</h3>
<hr />

<h2>宋体的问题</h2>

<h3>1) Opera 下，只认 "宋体"， 不认 SimSun</h3>
<p style="font: 12px '宋体', '微软雅黑';">Opera 下，只认 "宋体"， 不认 SimSun. font: 12px '宋体', '微软雅黑';</p>
<p style="font: 12px SimSun, '微软雅黑';">Opera 下，只认 "宋体"， 不认 SimSun. font: 12px SimSun, '微软雅黑';</p>
<p style="font: 12px \5b8b\4f53, '微软雅黑';">为了避免编码问题，推荐用：font: 12px \5b8b\4f53, '微软雅黑';</p>
<p style="font: 12px arial;">font: 12px arial; 此时，Opera 默认中文字体就是宋体。</p>
<p style="font: 12px sans-serif;">font: 12px sans-serif; 此时，Opera 默认中文字体就是宋体。</p>
<p style="font: 12px tahoma,arial,simsun,sans-serif;">font: 12px tahoma,arial,simsun,sans-serif; 对于'宋体'来说，如果后面已经没有中文字体，用 simsun 还是 ok 的。</p>

<h3>2) 设计偏好</h3>
<p style="font: 12px \5b8b\4f53;">宋体自带的英文和标点很难看，中英混排效果不好。中文和abcgtrfhjj256346中文</p>
<p style="font: 12px \5b8b\4f53;">优点是：英文字符是中文的一半，对齐容易。</p>
<hr />

<p style="height: 12px; margin: 0; padding: 0; font: 12px/1 \5b8b\4f53;">font: 12px/1 \5b8b\4f53; 行高为 1 时，IE6-7 下，高度不够时，会导致中文上下显示不全。</p>
<p style="margin: 0; padding: 0; font: 12px/1.5 \5b8b\4f53;">font: 12px/1.5 \5b8b\4f53; 行高为 1.5 时，一切正常。</p>
<hr />

<h2>GB 编码的问题</h2>

<p style="font: 12px sans-serif;">font: 12px sans-serif; 不设置宋体，页面为 GB 系列编码时，非中文操作系统下，IE 的默认字体是 Microsoft Sans Serif Regular, 很难看。</p>
<p style="font: 12px simsun,sans-serif;">font: 12px simsun,sans-serif; 不设置宋体，页面为 GB 系列编码时，非中文操作系统下，IE 的默认字体是 Microsoft Sans Serif Regular, 很难看。</p>
<p style="font: 12px arial;">font: 12px arial; 可以不写 sans-serif 来避免上面的问题。譬如百度的首页。 测试文字：设置宋体。</p>

可以看出，与 Tahoma 相比，Arial 只在 IE6 下略有优势。考虑以上各点，推荐使用以下方案：

理想主义者方案 A（所有页面用 utf-8 编码）：
<pre>
font: 12px/1.5 tahoma, arial, sans-serif;
</pre>
理想主义者方案 B（有 gb 编码的页面）：
<pre>
font: 12px/1.5 tahoma, arial, simsun, sans-serif;
</pre>
现实主义者方案 A：
<pre>
font: 12px/1.5 tahoma, arial;
</pre>
现实主义者方案 B：
<pre>
font: 12px/1.5 arial;
</pre>
</body>
</html>

[Ctrl+A 全部选择提示：你可先修改部分代码，再按运行]

Tags: IE6 IE6 字体字体 BUG BUG

分类:前端技术 | 固定链接 | 评论: 0 | 引用: 0 | 查看次数: 57