`
lovelium
  • 浏览: 18903 次
  • 性别: Icon_minigender_1
  • 来自: 广州
最近访客 更多访客>>
社区版块
存档分类
最新评论

共享一个登陆效果,可能有用!

阅读更多

又过了一周,周日闲时在家里没事。看着电脑启动的效果,突然想到一个效果,相信在网上应该有类似的效果。不过自己想方法,写代码算是原创吧。高手绕过,自己算不上程序员,只是爱好者所以代码写得不好请高手们不要见笑。现在还很粗糙,不过我想在高手如云的此地定会有更出色的效果加入进来。谢谢!
另:怪事,我发现在我的超宽本本上浏览的效果和我在台式机上不一样。不知何故?
效果演示:

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);
}

谢谢大家!

源码下载

 蓝色相关帖:http://bbs.blueidea.com/thread-2750518-1-1.html

博客:http://blog.szrgb.net

分享到:
评论

相关推荐

    自己制作电脑系统登陆界面的电脑窍门(转载出来一起共享)

    本文将深入探讨如何自己动手制作一个既美观又实用的电脑系统登录界面,帮助用户提升计算机使用的个性化水平。 #### 一、了解操作系统登录界面的工作原理 在开始制作自己的登录界面之前,首先需要理解操作系统登录...

    win7sp1多用户登陆补丁,包含x86和x64

    标题 "win7sp1多用户登陆补丁,包含x86和x64" 指的是一个专门针对Windows 7 Service Pack 1 (SP1) 操作系统的补丁,该补丁允许系统支持多个用户同时登录。在Windows 7原版系统中,仅支持单个用户在同一时间进行交互...

    Android开发登陆界面布局

    当多个子视图共享一个父容器,并且它们的宽度或高度设置为`fill_parent`时,`layout_weight`属性决定了这些子视图如何分割剩余的空间。 ### 实践案例分析 在给定的代码示例中,可以看到整个布局被封装在一个垂直的...

    WPF个性化示例

    例如,可以创建一个自定义的按钮样式,使其在鼠标悬停时有特定的背景颜色和边框效果。 2. **资源字典**:资源字典是存储可重用资源的地方,如颜色、字体、样式和模板。将这些资源集中管理可以使代码更加整洁,并且...

    渐变创意登陆页面免费矢量

    在这个主题下,"渐变创意登陆页面免费矢量"是一个引人注目的设计资源,特别适合那些寻求独特且吸引人的网页界面的设计师们。这个资源包含了AI和EPS格式的文件,以及一个JPEG预览图像,为设计师提供了灵活的编辑和...

    asp在线考试系统(asp+access实现)

    一个完备的等级考试系统可以使用户在网上学习过后及时检验自己的学习效果, 已发现自己的不足,使得学习效率得到很大提高。等级考试系统中题目的生成、试卷的提交、成绩的批阅等都可以在 上自动完成。只要形成一套...

    网管教程 从入门到精通软件篇.txt

    INT:中间代码,当一个源程序经过语法检查后编译产生一个可执行代码 IOF:Findit文档 IQY:Microsoft Internet查询文件 ISO:根据ISD 9660有关CD-ROM文件系统标准列出CD-ROM上的文件 ISP:X-Internet签字文件 ...

    基于J2EE框架的个人博客系统项目毕业设计论文(源码和论文)

    1、 Struts是一个为开发基于模型(Model)-视图(View)-控制器(Controller)(MVC)模式的应用架构的开源框架,是利用Servlet,JSP和custom tag library构建Web应用的一项非常有用的技术。由于Struts能充分满足应用开发...

    ASP设计在线考试系统OnlineTest

    一个完备的等级考试系统可以使用户在网上学习过后及时检验自己的学习效果, 已发现自己的不足,使得学习效率得到很大提高。等级考试系统中题目的生成、试卷的提交、成绩的批阅等都可以在 上自动完成。只要形成一套...

    UniGUI集合说明

    `ShowMessage()`是一个用于显示消息框的函数,在UniGUI中默认只能在服务器端使用。若要在客户端显示消息,可以考虑使用客户端脚本(如JavaScript)或者UniGUI提供的客户端消息显示功能。 #### 4. 修改工程文件,使...

Global site tag (gtag.js) - Google Analytics