※ ChatGPTを利用し、要約された質問です(原文:指定したレイヤーをfixed表示にする)
指定したレイヤーをfixed表示にする方法とは?
var css={
//省略
doFixed:function(element,LayerX,LayerY){
if(element.style.position!='absolute'){
element.style.position='absolute';
}
var LayerLeft=this.getLayerLeftonPage(element); //ページ上、レイヤーの左辺座標
var LayerTop=this.getLayerToponPage(element); //ページ上、レイヤーの上辺座標
this.setLayerPosition(element,LayerLeft,LayerTop); //対象,セットする対象の左辺座標,セットする対象の上辺座標
LayerX=LayerX ? LayerX : LayerLeft; //つまり、引数のLayerXは省略可能
LayerY=LayerY ? LayerY : LayerTop; //つまり、引数のLayerYは省略可能
addEvent(window,'scroll',function(){//イベントリスナです。
css.setLayerPosition(element,LayerX+css.getScrollLeft(),LayerY+css.getScrollTop());
/*
ウィンドウ上でスクロールされたら、直ちにセット。
css.getScrollLeft……X方向のスクロール量
css.getScrollTop……Y方向のスクロール量
*/
});
addEvent(document,'mousemove',function(evt){//ドラッグ要素にしたりしたときの対策
if(getEventElement(evt)===element){//event.targetのクロスブラウザ
LayerX=css.getLayerLeftonPage(element);
LayerY=css.getLayerToponPage(element);
}
});
},
//省略
};
このように、指定したレイヤーをfixed表示にする方法を思いついたのですが、どうしてもガタついてしまいます;
背景画像を固定するという方法も見かけますが、それは避けたいです><
どうにかして、出来ないでしょうか?
http://kyukyoku.xrsp.net/cgi-bin/Test.cgi
こちらがテストです。
御回答宜しくお願いしますm(_ _)m
補足
御回答ありがとうございます。 確かに、position:fixed;でも出来ますが、IE5などの古いブラウザでも対応させたいのです。(IETesterでテスト) IE5だと、fixed指定してもrelativeになってしまいます。