hideLAYER()

hideLAYER()

レイヤ－を見えない状態にするために表示属性のプロパティvisibilityに'hidden'を代入(n4では'hidden'または'hide')するサンプルファンクションです。

*このファンクションをコピーして<script>と</script>の間にペーストしておくだけでこの機能をクロスブラウザに利用できるようになります。
*Mac/Linux版Opera6ではonclick="命令"だけだとリロードがかかりvisibilityが初期化してしまうのでonclick="命令 ; return false" という記述が必要です。

Cross-Browser のための Sample Function


//--レイヤ－名で処理する場合

Syntax : hideLAYER('レイヤー名') 





  function hideLAYER(layName){
    if(document.getElementById)         //e5,e6,n6,n7,m1,o6,o7,s1用
      document.getElementById(layName).style.visibility='hidden'
    else if(document.all)               //e4用
      document.all(layName).style.visibility='hidden'
    else if(document.layers)            //n4用
      document.layers[layName].visibility='hide'
  }


Example

<script type='text/javascript'>
<!--

  function hideLAYER(layName){
    if(document.getElementById)         //e5,e6,n6,n7,m1,o6,o7,s1用
      document.getElementById(layName).style.visibility='hidden'
    else if(document.all)               //e4用
      document.all(layName).style.visibility='hidden'
    else if(document.layers)            //n4用
      document.layers[layName].visibility='hide'
  }

//-->
</script>

<!--↓このリンクをクリックすると/////////////////////////////////-->
<a href="#" onclick="hideLAYER('test0');return false">
クリックするとレイヤ－が消えます</a>

<!--↓このレイヤ－が消えます/////////////////////////////////////-->
<div id="test0" 
 style="position   : absolute ;
        left       : 180px    ;
        top        : 80px     ;
        font-size  : 24pt     ;
        visibility : visible  ;">
ばいばい
</div>


//--オブジェクト名で処理する場合

上記の関数をレイヤー名の代わりにオブジェクトで処理するようにしたもの。
ブラウザ毎の実装オブジェクト処理が別立てになるので関数がシンプルになる。


Syntax : hideLAYERoj(オブジェクト) 





  function hideLAYERoj(oj){
    if(!!oj) oj.visibility='hidden'     //e4,e5,e6,n4,n6,n7,m1,o6,o7,s1用
  }


Example
<script type='text/javascript'>
<!--

  function hideLAYERoj(oj){
    if(!!oj) oj.visibility='hidden'     //e4,e5,e6,n4,n6,n7,m1,o6,o7,s1用
  }

  //--layNameで指定したオブジェクトを返す(必ずonload後に実行すること)
  function getLayStyleOj(layName){  
    if(document.getElementById)         //e5,e6,n6,n7,m1,o6,o7,s1用
      return document.getElementById(layName).style
    else if(document.all)               //e4用
      return document.all(layName).style
    else if(document.layers)            //n4用
      return document.layers[layName]
  }

//-->
</script>

<!--↓このリンクをクリックすると/////////////////////////////////-->
<a href="#" onclick="hideLAYERoj(getLayStyleOj('test0'));return false">
クリックするとレイヤ－が消えます</a>

<!--↓このレイヤ－が消えます/////////////////////////////////////-->
<div id="test0" 
 style="position   : absolute ;
        left       : 180px    ;
        top        : 80px     ;
        font-size  : 24pt     ;">
ばいばい
</div>