又过了一周,周日闲时在家里没事。看着电脑启动的效果,突然想到一个效果,相信在网上应该有类似的效果。不过自己想方法,写代码算是原创吧。高手绕过,自己算不上程序员,只是爱好者所以代码写得不好请高手们不要见笑。现在还很粗糙,不过我想在高手如云的此地定会有更出色的效果加入进来。谢谢!
另:怪事,我发现在我的超宽本本上浏览的效果和我在台式机上不一样。不知何故?
效果演示:
http://www.szrgb.net/szrgb/officeadmin
相关JS代码作品展示
// 本代码由PAUL编写 主页:
www.szrgb.net
var i=0;
var sobjTimer;
var height=window.screen.height
var width=window.screen.width
function getObj(objName){return(document.getElementById(objName));}
//设置登录框位置
getObj("login").style.left=width/2-200;
getObj("login").style.top=height/2-200;
getObj("nextdiv").style.left=width/2-145;
getObj("nextdiv").style.top=height/2+40;
//渐显效果。要配合setInterval使用
function change(){
i++;
getObj("login").style.filter = "Alpha(Opacity=" + i + ")"; //for IE
getObj("login").style.opacity = i/100; //for FF
if(i>100) {window.clearInterval(sobjTimer);}
}
sobjTimer =window.setInterval(change,10);
//设置移过图片时图片为全显
function imgchangeon(dd){
getObj(dd).style.filter = "Alpha(Opacity=100)"; //for IE
getObj(dd).style.opacity = 100; //for FF
}
//设置移出图片时图片为半透
function imgchangeou(dd){
getObj(dd).style.filter = "Alpha(Opacity=50)"; //for IE
getObj(dd).style.opacity = 50; //for FF
}
//点击图片相关登录框显示
function clickme(id){
for(var i=1;i<=4;i++){
if(i==id) {
getObj("input"+i).style.display="block";
getObj("fft"+i).style.color="#E09504";
}
else{
if(i==4 || i==(id-1)){
getObj("input"+i).style.display="none";
getObj("fft"+i).style.color="#E8FBFF";
}
else{
getObj("input"+i).style.display="none";
getObj("fft"+i).style.color="#E8FBFF";
}
}
}
}
//暂为弹出所选用户名及输入密码。可以扩展
function showvalue(id){
var myname=getObj("fft"+id).innerText;
var mypass=getObj("pass"+id).value;
alert("用户名是:"+myname+" 密码:"+mypass);
}
var i=0;
var sobjTimer;
var height=window.screen.height
var width=window.screen.width
function getObj(objName){return(document.getElementById(objName));}
//设置登录框位置
getObj("login").style.left=width/2-200;
getObj("login").style.top=height/2-200;
getObj("nextdiv").style.left=width/2-145;
getObj("nextdiv").style.top=height/2+40;
//渐显效果。要配合setInterval使用
function change(){
i++;
getObj("login").style.filter = "Alpha(Opacity=" + i + ")"; //for IE
getObj("login").style.opacity = i/100; //for FF
if(i>100) {window.clearInterval(sobjTimer);}
}
sobjTimer =window.setInterval(change,10);
//设置移过图片时图片为全显
function imgchangeon(dd){
getObj(dd).style.filter = "Alpha(Opacity=100)"; //for IE
getObj(dd).style.opacity = 100; //for FF
}
//设置移出图片时图片为半透
function imgchangeou(dd){
getObj(dd).style.filter = "Alpha(Opacity=50)"; //for IE
getObj(dd).style.opacity = 50; //for FF
}
//点击图片相关登录框显示
function clickme(id){
for(var i=1;i<=4;i++){
if(i==id) {
getObj("input"+i).style.display="block";
getObj("fft"+i).style.color="#E09504";
}
else{
if(i==4 || i==(id-1)){
getObj("input"+i).style.display="none";
getObj("fft"+i).style.color="#E8FBFF";
}
else{
getObj("input"+i).style.display="none";
getObj("fft"+i).style.color="#E8FBFF";
}
}
}
}
//暂为弹出所选用户名及输入密码。可以扩展
function showvalue(id){
var myname=getObj("fft"+id).innerText;
var mypass=getObj("pass"+id).value;
alert("用户名是:"+myname+" 密码:"+mypass);
}
谢谢大家!