打印本文 打印本文 关闭窗口 关闭窗口
JavaScript实现仿Windows关机效果
作者:武汉SEO闵涛  文章来源:敏韬网  点击数2447  更新时间:2009/4/23 11:33:08  文章录入:mintao  责任编辑:mintao
on checkIt(string) {
        place = detect.indexOf(string) + 1;
        thestring = string;
        return place;
}
下面看一下网页加载时需要添加的方法。有关网页加载和初始化方法代码如下:
//网页加载调用initialize和getBrowserInfo方法
Event.observe(window, 'load', initialize, false);
Event.observe(window, 'load', getBrowserInfo, false);
//未加载时清空缓存
Event.observe(window, 'unload', Event.unloadCache, false);
//初始化方法
function initialize(){
        //调用该方法为该页添加覆盖层和高亮显示层
        addLightboxMarkup();
        //为每个可高亮显示的元素创建lightbox对象
        lbox = document.getElementsByClassName('lbOn');
        for(i = 0; i < lbox.length; i++) {
                    valid = new lightbox(lbox[i]);
        }
}
// 使用Dom方法创建覆盖层和高亮层
function addLightboxMarkup() {
        bod = document.getElementsByTagName('body')[0];
        overlay = document.createElement('div');
        overlay.id = 'overlay';
        lb = document.createElement('div');
        lb.id = 'lightbox';
        lb.className = 'loading';
        lb.innerHTML = '<div id="lbLoadMessage">' +
                                           '<p>Loading</p>' +
                                           '</div>';
        bod.appendChild(overlay);
        bod.appendChild(lb);
}
封装lightbox类
初始化数据时,为每个可高亮显示的链接创建了lightbox对象。该类的代码具体实现如下:
var lightbox = Class.create();  
lightbox.prototype = {
       yPos : 0,
       xPos : 0,
      //构造方法,ctrl为创建该对象的元素
       initialize: function(ctrl) {
              //将该元素的链接赋值给this.content
              this.content = ctrl.href;
              //为该元素添加onclick事件activate方法
              Event.observe(ctrl, 'click', this.activate.bindAsEventListener(this), false);
              ctrl.onclick = function(){return false;};
       },
       //当单击链接时
       activate: function(){
              if (browser == 'Internet Explorer'){//判断为IE浏览器
                     this.getScroll();
                     this.prepareIE('100%', 'hidden');
                     this.setScroll(0,0);
                     this.hideSelects('hidden');//隐藏所有的<select>标记
              }
              //调用该类中的displayLightbox方法
              this.displayLightbox("block");
      },
      prepareIE: function(height, overflow){
            bod = document.getElementsByTagName('body')[0];
            bod.style.height = height;
            bod.style.overflow = overflow;
  
            htm = document.getElementsByTagName('html')[0];
            htm.style.height = height;
            htm.style.overflow = overflow; 
      },
      hideSelects: function(visibility){
           selects = document.getElementsByTagName('select');
           for(i = 0; i < selects.length; i++) {
                   selects[i].style.visibility = visibility;
            }
      },
      getScroll: function(){
            if (self.pageYOffset) {
                    this.yPos = self.pageYOffset;
            } else if (document.documentElement && document.documentElement.scrollTop){
                    this.yPos = document.documentElement.scrollTop; 
            } else if (document.body) {
                    this.yPos = document.body.scrollTop;
            }
      },
      setScroll: function(x, y){
            window.scrollTo(x, y); 
      },
      displayLightbox: function(display){
            //将覆盖层显示
            $('overlay').style.display = display;
            //将高亮层显示
            $('lightbox').style.display = display;
            //如果不是隐藏状态,则调用该类中的loadInfo方法
            if(display != 'none') this.loadInfo();
      },
      //该方法发送Ajax请求
      loadInf function() {
            //当请求完成后调用本类中processInfo方法
            var myAjax = new Ajax.Request(
          this.content,
          {method: 'get', parameters: "", onComplete: this.processInfo.bindAsEvent Listener (this)}
           );
      },
      // 将返回的文本信息显示到高亮层上
      processInf function(response){
           //获得返回的文本数据
         &

上一页  [1] [2] [3]  下一页

打印本文 打印本文 关闭窗口 关闭窗口