SitePoint Sponsor

User Tag List

Results 1 to 3 of 3
  1. #1
    SitePoint Zealot ruben's Avatar
    Join Date
    Dec 2000
    Location
    home
    Posts
    167
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Hiding and showing layers

    Can someone please tell me of a script that makes it possible to click a button so that one or more layers hide? And when I click the button again, it will appear? I would really appreciate a solution.
    Why is duck?

  2. #2
    SitePoint Guru Vincent Puglia's Avatar
    Join Date
    Feb 2000
    Location
    where the World once stood
    Posts
    700
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Hi ruben,

    see the "dHTML: an Introduction" script/tutorial at my site (GrassBlade)

    Vinny
    Where the World Once Stood
    the blades of grass
    cut me still

  3. #3
    <C²: web standards /> cybercodeur's Avatar
    Join Date
    Dec 2001
    Location
    Montréal
    Posts
    729
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Here. With this html page you will have all the basic instructions as to how make appear/disappear an element in your page, using javascript and css. It comes in part from dhtmlcentral.com

    Happy new year!

    <html>
    <head>
    <title>Show/hide</title>

    <style media="screen" type="text/css">
    .TopMenu {color:#ffffff; font-family:Verdana, Arial, Helvetica; font-weight :normal; font-size:11px; text-decoration: none;}
    .SubMenu{color:#000000; font-family:Verdana, Arial, Helvetica; font-weight :normal; font-size:11px; text-decoration: none;}


    #divSubMenu0{position:absolute; left:0; top:50; z-index:1; visibility:hidden;}
    </style>

    <script language="JavaScript" type="text/javascript">


    function lib_bwcheck(){
    this.ver=navigator.appVersion
    this.dom=document.getElementById?1:0
    this.ie6=(this.ver.indexOf("MSIE 6")>-1 && this.dom)?1:0;
    this.ie5=(this.ver.indexOf("MSIE 5")>-1 && this.dom)?1:0;
    this.ie4=(document.all && !this.dom)?1:0;
    this.ie=this.ie4||this.ie5||this.ie6
    this.ns5=(this.dom && parseInt(this.ver) >= 5) ?1:0;
    this.ns4=(document.layers && !this.dom)?1:0;
    this.bw=(this.ie6 || this.ie5 || this.ie4 || this.ns4 || this.ns5)
    return this
    }

    var bw=new lib_bwcheck()



    function lib_obj(obj,nest){
    nest= (!nest)?"":'document.'+nest+'.';
    this.el= bw.ie4?document.all[obj]:bw.ns4?eval(nest+'document.'+obj):document.getElementById(obj);
    this.css= bw.ns4?this.el:this.el.style;
    this.ref= bw.ns4?this.el.document:document;
    this.hideIt= b_hideIt;
    this.showIt= b_showIt;
    return this
    }

    function b_showIt(){this.css.visibility='visible'}
    function b_hideIt(){this.css.visibility='hidden'}


    function init(){

    SubMenu0=new lib_obj('divSubMenu0')
    }

    onload=init;

    </script>
    </head>

    <body leftmargin=0 topmargin=0 marginwidth="0" marginheight="0">

    <a href="#" onclick="javascript:SubMenu0.showIt();">Show text</a>
    <a href="#" onclick="javascript:SubMenu0.hideIt();">Hide text</a>


    <div id="divSubMenu0" class="SubMenu">
    Text to appear/disappear.
    </div>


    </body>
    </html>
    Last edited by cybercodeur; Jan 1, 2002 at 12:31.
    Denis Boudreau <C²/> - Web Standards & Accessibility
    [+] ICQ number: 115649885 || Email: denis@cybercodeur.net
    [+] Daily Weblog on Web standards and accessibility : CYBERcodeur.net


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •