Skip navigation
Currently Being Moderated

Help with JavaScript code

Jun 6, 2012 7:25 PM

Tags: #javascript #html_code_writing

I need some help with my JS code that I've posted below. What I'm looking to do is make the second menu start off in the up position.

 

 

// JavaScript Document

var sliderIntervalId = 0;

var sliderHeight = 275;

var sliding = false;

var slideSpeed = 10;

 

function Slide()

{

   if(sliding)

      return;

   sliding = true;

   if(sliderHeight == 275)

      sliderIntervalId = setInterval("SlideUpRun()", 30);

   else

      sliderIntervalId = setInterval("SlideDownRun()", 30);

}

 

function SlideUpRun()

{

   slider = document.getElementById('exampleSlider');

   if(sliderHeight <= 0)

   {

      sliding = false;

      sliderHeight = 0;

      slider.style.height = '0px';

      clearInterval(sliderIntervalId);

   }

   else

   {

      sliderHeight -= slideSpeed;

      if(sliderHeight < 0)

         sliderHeight = 0;

      slider.style.height = sliderHeight + 'px';

   }

}

 

function SlideDownRun()

{

   

   slider = document.getElementById('exampleSlider');

    if(sliderHeight >= 275)

    {

        sliding = false;

        sliderHeight = 275;

        slider.style.height = '275px';

        clearInterval(sliderIntervalId);

    }

    else

    {

        sliderHeight += slideSpeed;

        if(sliderHeight > 275)

        sliderHeight = 275;

        slider.style.height = sliderHeight + 'px';

    }

}//end SlideDownrun function

 

function Slide1()

{

   if(sliding)

      return;

   sliding = true;

   if(sliderHeight == 275)

      sliderIntervalId = setInterval("SlideUpRun1()", 30);

   else

      sliderIntervalId = setInterval("SlideDownRun1()", 30);

}

 

function SlideUpRun1()

{

   slider = document.getElementById('exampleSlider1');

   if(sliderHeight <= 0)

   {

      sliding = false;

      sliderHeight = 0;

      slider.style.height = '0px';

      clearInterval(sliderIntervalId);

   }

   else

   {

      sliderHeight -= slideSpeed;

      if(sliderHeight < 0)

         sliderHeight = 0;

      slider.style.height = sliderHeight + 'px';

   }

}

 

function SlideDownRun1()

{

   

   slider = document.getElementById('exampleSlider1');

    if(sliderHeight >= 275)

    {

        sliding = false;

        sliderHeight = 275;

        slider.style.height = '275px';

        clearInterval(sliderIntervalId);

    }

    else

    {

        sliderHeight += slideSpeed;

        if(sliderHeight > 275)

        sliderHeight = 275;

        slider.style.height = sliderHeight + 'px';

    }

}//end SlideDownrun1 function

 

function SlideUpRun2()

{

   slider = document.getElementById('exampleSlider1');

   if(sliderHeight <= 0)

   {

      sliding = false;

      sliderHeight = 0;

      slider.style.height = '0px';

      clearInterval(sliderIntervalId);

   }

   else

   {

      sliderHeight -= slideSpeed;

      if(sliderHeight < 0)

         sliderHeight = 0;

      slider.style.height = sliderHeight + 'px';

   }

}

 

function SlideDownRun2()

{

   

   slider = document.getElementById('exampleSlider2');

    if(sliderHeight >= 275)

    {

        sliding = false;

        sliderHeight = 275;

        slider.style.height = '275px';

        clearInterval(sliderIntervalId);

    }

    else

    {

        sliderHeight += slideSpeed;

        if(sliderHeight > 275)

        sliderHeight = 275;

        slider.style.height = sliderHeight + 'px';

    }

}//end SlideDownrun1 function

HTML code

<div id="slidermenu">

  <div id="secondary">

    <div style="position:absolute;width:18px;height:18px;right:0px;

          top:0px;background-color:#ED1C24;text-align:center;

          border-left:1px solid #FFFFFF;color:#f2f1f1;

          cursor:pointer;padding:0px;" onclick="Slide();">

      <table width="100%" height="15px" cellspacing="0" cellpadding="0">

        <tr>

          <td align="center" valign="middle" style="text-size:9pt;">

            X

          </td>

        </tr>

      </table>

    </div>

  </div>

  <div id="exampleSlider" style="position:absolute; top:18px; left:-19px; width:250px; height:275px; background-color:#474acd; border:1px solid #ED1C24; color:#ED1C24; overflow:hidden;">

    <table width="100%" height="100%">

      <tr>

        <td valign="top" style="padding:3px;">

  

          </ul>

        </td>

      </tr>

    </table> 

  </div><!--end secondarydiv-->

</div><!--End of slidermenu0 div-->

<br />

<div id="slidermenu1">

  <div id="secondary1">

    <div style="position:absolute;width:18px;height:18px;right:0px;

          top:0px;background-color:#ED1C24;text-align:center;

          border-left:1px solid #FFFFFF;color:#f2f1f1;

          cursor:pointer;padding:0px;" onclick="Slide1();">

      <table width="100%" height="15px" cellspacing="0" cellpadding="0">

        <tr>

          <td align="center" valign="middle" style="text-size:9pt;">

            X

          </td>

        </tr>

      </table>

    </div>

  </div>

  <div id="exampleSlider1" style="position:absolute; top:18px; left:-19px; width:250px; height:300px; background-color:#474acd; border:1px solid #ED1C24; color:#ED1C24; overflow:hidden;">

    <table width="100%" height="100%">

      <tr>

        <td valign="top" style="padding:3px;">

         

          <ul>

         

          </ul>

        </td>

      </tr>

    </table> 

  </div><!--end secondarydiv-->

</div><!--End of slidermenu1 div-->

 

More Like This

  • Retrieving data ...

Bookmarked By (0)

Answers + Points = Status

  • 10 points awarded for Correct Answers
  • 5 points awarded for Helpful Answers
  • 10,000+ points
  • 1,001-10,000 points
  • 501-1,000 points
  • 5-500 points