柴鸡的窝 » JQuery http://www.enjoyeasy.com.cn/blog 又不是武松，哪来什么武功。。。 Tue, 22 Nov 2011 11:20:04 +0000 en hourly 1 http://wordpress.org/?v=3.3.1 伪装ajax进度条 http://www.enjoyeasy.com.cn/blog/fake-ajax-loading-bar/ http://www.enjoyeasy.com.cn/blog/fake-ajax-loading-bar/#comments Fri, 22 Oct 2010 08:33:30 +0000 baljeans http://www.enjoyeasy.com.cn/blog/?p=716 话说这种效果很古老的了，去年年初的时候特别流行，其实很简单：

第一步：引入jquery库后添加下边的代码到header.php的<body>后边

<div id=”loading”><div><span>正在加载…</span></div></div>


第二步：添加下边的代码到style.css里

#loading {
width:100px;
height:30px;
position:fixed;
_position:absolute;
left:0;
top:0;
background-color: #990000;
color:#FFFFFF;
z-index:999;
text-align: center;
}
#loading span {
position:absolute;
top:7px;
left:0;
width:100px;
}
#loading div {
width:1px;
height:30px;
filter:alpha(opacity=90);
opacity:0.9;
float:left;
background-color: #B3231C;
}

第三步：添加下边的代码header.php的最后和sidebar.php的中间任意位置

<script type=”text/javascript”>
$(“#loading div”).animate({width:”20px”});
</script>

<script type=”text/javascript”>
$(“#loading div”).animate({width:”70px”});
</script>

第四步：添加下边的代码footer.php的最后就可以了

<script type=”text/javascript”>
$(“#loading div”).animate({width:”100px”},function(){
$(‘span:eq(0)’).replaceWith(‘<span>加载完成…<\/span>’);
$(“#loading”).fadeOut(1000);
});
</script>

]]> http://www.enjoyeasy.com.cn/blog/fake-ajax-loading-bar/feed/ 10 JQuery仿有啊图片震动效果 http://www.enjoyeasy.com.cn/blog/jquery-shake-effect/ http://www.enjoyeasy.com.cn/blog/jquery-shake-effect/#comments Fri, 26 Jun 2009 15:16:56 +0000 baljeans http://www.enjoyeasy.com.cn/blog/jquery%e4%bb%bf%e6%9c%89%e5%95%8a%e5%9b%be%e7%89%87%e9%9c%87%e5%8a%a8%e6%95%88%e6%9e%9c/ 这个是之前逛有啊时候发现的 弄的效果不是很像 不过也差不多了

点击查看演示

]]> http://www.enjoyeasy.com.cn/blog/jquery-shake-effect/feed/ 24 密码强度检测 http://www.enjoyeasy.com.cn/blog/password-intensity/ http://www.enjoyeasy.com.cn/blog/password-intensity/#comments Thu, 18 Jun 2009 01:33:02 +0000 baljeans http://www.enjoyeasy.com.cn/blog/%e5%af%86%e7%a0%81%e5%bc%ba%e5%ba%a6%e6%a3%80%e6%b5%8b/ 应该是最简单的密码强度检测了 只根据密码长度进行判断 我自己都要忍不住汗一个。。。

点击查看演示

]]> http://www.enjoyeasy.com.cn/blog/password-intensity/feed/ 15 IE6提示信息 http://www.enjoyeasy.com.cn/blog/hint-of-ie6/ http://www.enjoyeasy.com.cn/blog/hint-of-ie6/#comments Sat, 23 May 2009 20:48:20 +0000 baljeans http://www.enjoyeasy.com.cn/blog/ie6%e6%8f%90%e7%a4%ba%e4%bf%a1%e6%81%af/ 见到很多提示信息 都不够关注细节 要么提示信息的位置不能随着屏幕的滚动而改变位置
要么黑色的背景只遮罩了初始的屏幕大小 而不是整个网页的大小 所以就自己动手写了一个
按 Esc 或者 X（不分大小写）可关闭提示信息

点击查看演示

]]> http://www.enjoyeasy.com.cn/blog/hint-of-ie6/feed/ 7 Jquery实现Konami Code http://www.enjoyeasy.com.cn/blog/jquery-konami-code/ http://www.enjoyeasy.com.cn/blog/jquery-konami-code/#comments Sat, 23 May 2009 20:34:42 +0000 baljeans http://www.enjoyeasy.com.cn/blog/jquery%e5%ae%9e%e7%8e%b0konami-code/ 仿Facebook彩蛋 按下“上上下下左左右右”触发事件 演示当中已经添加了注释 有兴趣的朋友可以研究研究

点击查看演示

]]> http://www.enjoyeasy.com.cn/blog/jquery-konami-code/feed/ 4