javascript - ほとんどのブラウザーで JQuery プラグインが表示されない

Question

ドラッグ可能なマップ (xy) を表示する JQuery プラグインを作成しました。

Firefox では問題なく動作しますが、他のブラウザではバグがあります。

バグ: 通常、サイトの読み込み時にマップが表示されるはずです。ただし、firefox を除くすべてのブラウザでは、マップをドラッグするまで黒い画面しか表示されず、機能します。

どうすればそれを修正できるかわかりません。

例: http://jsfiddle.net/X42Wf/

例を見ていない場合 (firefox を使用していない場合)、実行してから黒い出力をドラッグしてください。

Answer 1

は初期化時 (最初のドラッグ前を意味します) にinnerDiv.css('left')設定されます。autoそのため、getVisibleTiles関数では、mapXequals と等しいNaNため、二重の for ループは実行されません。

これを編集するだけです：

jQuery('<div/>', {
    id: 'GameMap',
    height: o.InnerDivHeight,
    width: o.InnerDivWidth
}).appendTo(obj);

これとともに：

jQuery('<div/>', {
    id: 'GameMap',
    height: o.InnerDivHeight,
    width: o.InnerDivWidth,
    css: {
        left: 0,
        top: 0
    }
}).appendTo(obj);

---

また、IE での副作用を回避したい場合は、次の 2 つの例のように、オブジェクト宣言の末尾にあるコンマを削除する必要があります。

jQuery('<div/>', {
    id: tileName,
    style: "some CSS string", // <----- remove this comma or it will break on IE
}).appendTo(innerDiv).text(tileName);

jQuery('<div/>', {
    id: 'GameMap',
    height: o.InnerDivHeight,
    width: o.InnerDivWidth, // <----- this one too
}).appendTo(obj);