Javascript関連情報

更新日:2002年03月06日

クロスブラウザを制する 2-23 レイヤ-右辺X座標get

ブラウザ(または親要素)左端からのレイヤ-右辺位置をピクセルで取得するためのサンプルファンクション。



*
















getRIGHT('レイヤ?名')
Win n4 n6 moz e4 e5 e6 O6,
Mac n4 n6 moz e4.5 e5 ,
Linux n4 n6 moz
ブラウザ(または親要素)左端からのレイヤ?右辺位置をピクセルで取得するためのサンプルファンクション。
<script language='JavaScript'>
<!--

 /*////////// レイヤ?右辺X座標get用関数 20020304 UseFree ========================================================  Win  n4 n6 moz e4 e5 e6 O6 ,  Mac  n4 n6 moz e4.5 e5 ,  Linux n4 n6 moz                                n(Netscape) e(IE) O(Opera) ========================================================  使用例  //ブラウザ(または親要素)左端からの          //レイヤ?右辺位置をピクセルで取得する          //Moz,NN6では初期値がなければ空白が返る    getRIGHT('レイヤ?名')    Support http://game.gr.jp/js/ =======================================================*/    function getRIGHT(layName){     if(document.all){                     //e4,e5,e6,o6用       return  document.all(layName).style.pixelLeft              +document.all(layName).style.pixelWidth     } else if(document.getElementById){   //n6,m1用       var l = document.getElementById(layName).style.left       var w = document.getElementById(layName).style.width       return ( l!="" && w!="" )?parseInt(l)+parseInt(w):""      } else  if(document.layers){          //n4用       return document.layers[layName].left              +document.layers[layName].clip.right     }   } /*//////////////// レイヤ?右辺X座標get用関数ここまで */ 

//-->
</script>

<!--↓このリンクをクリックすると右辺の位置がわかります-->
<div id="a0" 
 style="position   : absolute  ;
        left       : 100px     ;
        top        : 80px      ;
        width      : 300px     ;
        height     : 100px     ;
        clip       : rect(0,300,100,0) ;
        font-size  : 12pt      ;
">
<a href="javascript:alert(getRIGHT('a0'))">
このレイヤ?の右端はぺ?ジ(または親要素)の左端から
何ピクセル?
</a>
</div>

</div>


* 緑文字が今回の関数
* 赤文字がこのスクリプトで最初に動作する部分
						
ブラウザ画面左端からレイヤ?右辺(可視のclip範囲内の右辺)までのピクセル数を取得するためのサンプルファンクションです。レイヤ?の右端がぺ?ジの左端から何ピクセルあるか?ということです。 N4ではleftとclip.rightを、Moz,NN6ではleftとrightを、IE4,IE5,IE6,O6ではpixelLeftとpixelWidthを足しています。注:CSSのwidth,height,clipをインラインで指定してください。N6,Moz,IE6ではインラインで指定していない場合初期値は空白です。


★次のページにサンプルと応用スクリプトを用意しました。 
| 次のページ→| シリーズ目次 |



1 2
  • 印刷する
  • ブックマークする
  • 携帯に送る
  • ブログに書く

あわせて読みたい

この記事の担当ガイド

写真

高橋 登史朗

Javascriptをはじめ、Ajax、jQueryの著書多数のガイドが、何かと最近騒がれているJa…

続きを読む

人気Javascriptランキング

Powered by 価格.com

おすすめ記事

メルマガ登録

【デジタルメルマガ】オトナのオトコなら知っておきたい、PCやデジモノに関する情報をお届けします。

All About モバイル

QRコード

All Aboutがケータイで読める!

オススメ記事をメールでチェック