SitePoint Sponsor

User Tag List

Results 1 to 3 of 3
  1. #1
    SitePoint Zealot
    Join Date
    May 2003
    Location
    maine
    Posts
    129
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Help with a Code

    Hey guys, if you go to denniskirk.com , you will see a sliding window that pops in from the left and slides to the right. Does anyone have any code to make this happen ?

    Thanks so much, im just learning Javascript...

    Steelejones

  2. #2
    SitePoint Aficionado JVLB's Avatar
    Join Date
    Jan 2002
    Location
    N 44 56.537' W 123 3.683'
    Posts
    1,127
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Here's some code I did for someone on another forum site. It slides from the bottom and has as its contents an iframe, but it should be easy to modify. See if it helps:

    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN""http://www.w3.org/TR/html4/strict.dtd">
    <html>
    <head>
    <title>Slide demo 05-30-04</title>
    <meta http-equiv="content-type" content="text/html; charset=iso-8859-1">
    <style type="text/css">
    body{height:100%;margin:0;padding:0;}
    div{position:absolute;margin:0;padding:0;}
    iframe#ifOne{width:100%;}
    #main{height:100%;width:100%;}
    #topDiv{height:100%;width:100%;background:#BCF;}
    #botDiv{bottom:0;width:100%;height:10px;background:#DAA;overflow:hidden;text-align:center;}
    #widg{position:relative;height:0;width:0;margin:2px auto;padding:0;overflow:hidden;border-left:12px solid #DAA;border-right:12px solid #DAA;border-bottom:6px solid #F00;}
    </style>
    <script type="text/javascript">
    var upDn=0;
    var bD;
    function setHt(){
    bD=document.getElementById("botDiv");
    bD.style.height="10px"
    }
    function sliDiv(){
    var stVal=bD.style.height;
    if(upDn==0){
    var nmVal=stVal.split("p");
    var nwVal=Number(nmVal[0])+1;
    bD.style.height=String(nwVal)+"px"
    if(nwVal>60){
    clearInterval(toId);
    var wg=document.getElementById("widg");
    wg.style.borderBottom="0";
    wg.style.borderTop="6px solid #F00";
    upDn=1;
    }
    }
    if(upDn==1){
    var nmVal=stVal.split("p");
    var nwVal=Number(nmVal[0])-1;
    bD.style.height=String(nwVal)+"px"
    if(nwVal==10){
    clearInterval(toId);
    var wg=document.getElementById("widg");
    wg.style.borderTop="0";
    wg.style.borderBottom="6px solid #F00";
    upDn=0;
    }
    }
    }
    function run_sliDiv(){
    toId=setInterval("sliDiv()",8);
    }
    </script>
    </head>
    <body onload="setHt();">
    <div id="main">
    <div id="topDiv">
    </div>
    <div id="botDiv" onclick="run_sliDiv();">
    <div id="widg"></div>
    <div style="position:relative;">
    <iframe src="" id="ifOne">
    </iframe>
    </div>
    </div>
    </div>
    </body>
    </html>

  3. #3
    SitePoint Zealot
    Join Date
    May 2003
    Location
    maine
    Posts
    129
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Thanks so much!


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
  •