Javascript関連情報

更新日:2002年08月29日

クロスブラウザを制する 2-32 ヘルプウインドウ

クリックしたそばにヘルプダイアログのようにサブウインドウを開くサンプルファンクションです。








このリンクをクリックしたそばに
サブウインドウが開きます



openHELPWIN(event,url,targetName,offsetx,offsety,width,height)
Win n4 n6 n7 moz e4 e5 e6 o6 ,
Mac n4 n6 n7 moz e4.5 e5 ,
Linux n4 n6 n7 moz
クリックしたそばに サブウインドウを開くサンプルファンクションです。

<script language='JavaScript'>
<!--

  //ポップアップウインドウの相対位置とサイズを決めて
  //openHELPWIN(event,url,offsetx,offsety,width,height)を起動する
   function openHELPWIN(e,url,targetName,offsetx,offsety,width,height){      //マウスの現在位置     var mouseXonScreen = null     var mouseYonScreen = null        //マウスの現在位置取得     if(document.all){                                        //e4,e5,e6        mouseXonScreen = window.event.screenX         mouseYonScreen = window.event.screenY      } else if(document.layers || document.getElementById ){         //n4,n6,n7,m1,o6        mouseXonScreen = e.screenX        mouseYonScreen = e.screenY      }      //マウスの現在位置から何ピクセル離すかをセット     var setx = mouseXonScreen + offsetx     var sety = mouseYonScreen + offsety      //サブウインドウを開く     //(引数以外のパラメータも下記でセットできます)     var para =""              +" left="        +setx              +",screenX="     +setx              +",top="         +sety              +",screenY="     +sety              +",toolbar="     +0              +",location="    +0              +",directories=" +0              +",status="      +0              +",menubar="     +0              +",scrollbars="  +0              +",resizable="   +1              +",innerWidth="  +width              +",innerHeight=" +height              +",width="       +width              +",height="      +height        helpwin=window.open(url,targetName,para)       helpwin.focus()   }   
//-->
</script>

<br>
<br>
<br>

 <a href="javascript:void(0)" 
    onclick="openHELPWIN(event,'sub1.htm','',100,-50,250,200)">
クリックしたそばに<br>サブウインドウが開きます 
</a>




* 緑文字が今回の関数
* 赤文字がこのスクリプトで最初に動作する部分
						
これはヘルプダイアログのようにマウスクリックした場所のそばへサブウインドウを 開くためのファンクションです。マウス位置の検知方法がブラウザによって異なるのでそれらをクロスして吸収するようにしています。 引数は順番にevent、読み込むurl、クリック位置からX方向へ何ピクセル離すか(offsetx)、クリック位置からY方向へ何ピクセル離すか(offsety)、 サブウインドウの幅、サブウインドウの高さ です。


シリーズ目次 |



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

あわせて読みたい

この記事の担当ガイド

写真

高橋 登史朗

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

続きを読む

人気Javascriptランキング

Powered by 価格.com

おすすめ記事

メルマガ登録

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

All About モバイル

QRコード

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

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