//总的效果就是依次让三个显示条,透明度变为1,再变为0.2
firstBar.fadeTo(‘fast’, 1, function () {
firstBar.fadeTo(‘fast’, 0.2, function () {
secondBar.fadeTo(‘fast’, 1, function () {
secondBar.fadeTo(‘fast’, 0.2, function () {
thirdBar.fadeTo(‘fast’, 1, function () {
thirdBar.fadeTo(‘fast’, 0.2)
});
});
});
});
});
};
//对go按钮设置toggle事件
$(‘#go’).toggle(function () {
//第一次点击的时候,显示loader,创建setInterval,每1200毫秒执行一次runLoader
loader.show();
runLoader();
loadingInterval = setInterval(runLoader, 1200);
}, function () {
//再次点击的时候,隐藏loader,删除setInterval
loader.hide();
clearInterval(loadingInterval);
});
});
</script>
<style type=”text/css”>
#loader
{
margin: 10px 0 0 36px;
}
#loader span
{
display: block;
width: 6px;
float: left;
margin-right: 6px;
border: 1px solid #336633;
position: relative;
background-color: #ccffcc;
}
#loader .bar-0
{
height: 15px;
bottom: -20px;
}
#loader .bar-1
{
height: 25px;
bottom: -10px;
}
#loader .bar-2
{
height: 35px;
margin-right: 0;
}
</style>
</head>
<body>
<input id=”go” type=”button” value=”Initiate the action” />
</body>
</html>










