以前作成した JavaScript の透明フロートレイヤー

muta244@admin — Thu, 30 Oct 2008 09:06:04 +0000

前に MT アップデートした時に一式データが消えてしまったけど、101LAB さんに保管されてた、感謝。忘れないうちに貼付けておきます。

JavaScript

function FloatLayer() {
    this.initialize.apply(this, arguments);
};

FloatLayer.prototype = {

    initialize:function () {},

    add:function () {
        var container = document.createElement("div");
        $(container).attr("id", "floatLayer");
        $(container).css({margin:0, padding:0, background:"none"});
        $(document.body).append(container);
        var input = document.createElement("input");
        $(input).attr("type", "button");
        $(input).attr("value", "クリックで閉じる");
        $(container).append(input);
        $(input).click(function () {
            $("#floatLayer").remove();
        });

        if($.browser.msie) {
            if(!window.XMLHttpRequest || !document.compatMode.match(/CSS/i)) {
                $(container).css({position:"absolute", background:"#000000", filter: "alpha(opacity=50)"});
                this.optimizeScroll();
                $(window).scroll(this.optimizeScroll);
                this.optimizeSize();
                $(window).resize(this.optimizeSize);
            }
        } else {
            $(container).css({width:"100%", height:"100%", position:"fixed", left:0, top:0,
                background:"#000000", opacity: 0.5
            });
        }
    },

    optimizeScroll:function () {
        var scrollLeft = (document.compatMode.match(/CSS/i)) ?
                document.documentElement.scrollLeft : document.body.scrollLeft;
        var scrollTop  = (document.compatMode.match(/CSS/i)) ?
                document.documentElement.scrollTop : document.body.scrollTop;
        $("#floatLayer").css({
            left:scrollLeft,
            top:scrollTop
        });
    },

    optimizeSize:function () {
        var windowWidth = (document.compatMode.match(/CSS/i)) ?
            document.documentElement.clientWidth : document.body.clientWidth;
        var windowHeight = (document.compatMode.match(/CSS/i)) ?
            document.documentElement.clientHeight : document.body.clientHeight;
        $("#floatLayer").width(windowWidth);
        $("#floatLayer").height(windowHeight);
    }
};

var floatLayer = new FloatLayer();
floatLayer.add();

JavaScript で型判別

muta244@admin — Wed, 29 Oct 2008 16:52:12 +0000

ActionScript 3 なら is 演算子で一発な型判別。JavaScript では is 演算子が使えないのでそうもいかず、typeof だと null が object として扱われる（Array とか自作クラスも同じ）し、instanceof ではすべてのクラスが Object のインスタンスとして判別されるため、この二つは役不足。なにか方法がないかと模索してみた結果、constructor プロパティで判別するのが良さそうです。

以下、テストコード。

JavaScript

function Test() {};
var test = new Test();

alert(test.constructor == Object); // false
alert(test.constructor == Test); // true
alert(null.constructor); // TypeError: null has no properties
alert(undefined.constructor); // TypeError: undefined has no properties

InternetExplorer, Firefox, Safari などのブラウザですべて同じ動作なので、これが試した限りでは一番確実っぽいです。他に良い方法があればコメント欄で教えてください。

unbland.org blog » JavaScript

以前作成した JavaScript の透明フロートレイヤー

JavaScript で型判別