Web Analytics Made Easy -
StatCounter Targeting Scrollable Content Script II - CodingForum

Announcement

Collapse
No announcement yet.

Targeting Scrollable Content Script II

Collapse
X
 
  • Filter
  • Time
  • Show
Clear All
new posts

  • Targeting Scrollable Content Script II

    I was wondering if it were possible to use a hide/show script that was targeted to the Scrollable content script II. I can't exactly explain it so here's an image:




    I need all the help I can get, guys. I've been brooding about this for weeks now and finally it's time to ask. Thanks


    Here's a link to the code: http://www.dynamicdrive.com/dynamicindex11/scrollc2.htm
    Last edited by Probably James; Aug 3, 2005, 12:25 AM.

  • #2
    sure you can...instead of having a single container div have lots

    Code:
    <div id="container1" style="display:none">...</div>
    <div id="container2" style="display:none">...</div>
    Code:
    function show_hide(target) {
      if ( target.style.display == "none" ) {
        target.style.display = "block";
      } else {
        target.style.display = "none";
      }
    Code:
    <a href=".." onclick="show_hide(document.getElementById('container1'))">Link1</a>
    You never have to change anything you got up in the middle of the night to write. -- Saul Bellow

    Comment


    • #3
      Please excuse my lack of knowledge on the subject, but is this what you meant? Probably not, since it doesn't work. What exactly am I doing wrong?

      Code:
      <script type="text/javascript">
      function show_hide(target) {
        if ( target.style.display == "none" ) {
          target.style.display = "block";
        } else {
          target.style.display = "none";
        } 
      </script>
      
      <script type="text/javascript">
      
      /******************************************
      * Scrollable content script II- © Dynamic Drive ([url]www.dynamicdrive.com[/url])
      * Visit [url]http://www.dynamicdrive.com/[/url] for full source code
      * This notice must stay intact for use
      ******************************************/
      
      iens6=document.all||document.getElementById
      ns4=document.layers
      
      //specify speed of scroll (greater=faster)
      var speed=5
      
      if (iens6){
      document.write('<div id="container" style="position:relative;width:175px;height:160px;border:1px solid black;overflow:hidden">')
      document.write('<div id="content" style="position:absolute;width:170px;left:0;top:0">')
      }
      </script>
      
      <ilayer name="nscontainer" width=175 height=160 clip="0,0,175,160">
      <layer name="nscontent" width=175 height=160 visibility=hidden>
      
      <!--INSERT CONTENT HERE-->
      <div id="container1" style="display:none">...</div>
      <div id="container2" style="display:none">...</div>
      <!--END CONTENT-->
      
      </layer>
      </ilayer>
      
      <script language="JavaScript1.2">
      if (iens6)
      document.write('</div></div>')
      </script>
      
      <table width="175px"><td><p align="right">
      <a href="#" onMouseover="moveup()" onMouseout="clearTimeout(moveupvar)">Up</a>  <a href="#" onMouseover="movedown()" onMouseout="clearTimeout(movedownvar)">Down</a></p></td>
      </table>
      
      <script language="JavaScript1.2">
      if (iens6){
      var crossobj=document.getElementById? document.getElementById("content") : document.all.content
      var contentheight=crossobj.offsetHeight
      }
      else if (ns4){
      var crossobj=document.nscontainer.document.nscontent
      var contentheight=crossobj.clip.height
      }
      
      function movedown(){
      if (iens6&&parseInt(crossobj.style.top)>=(contentheight*(-1)+100))
      crossobj.style.top=parseInt(crossobj.style.top)-speed+"px"
      else if (ns4&&crossobj.top>=(contentheight*(-1)+100))
      crossobj.top-=speed
      movedownvar=setTimeout("movedown()",20)
      }
      
      function moveup(){
      if (iens6&&parseInt(crossobj.style.top)<=0)
      crossobj.style.top=parseInt(crossobj.style.top)+speed+"px"
      else if (ns4&&crossobj.top<=0)
      crossobj.top+=speed
      moveupvar=setTimeout("moveup()",20)
      
      }
      
      function getcontent_height(){
      if (iens6)
      contentheight=crossobj.offsetHeight
      else if (ns4)
      document.nscontainer.document.nscontent.visibility="show"
      }
      window.onload=getcontent_height
      </script>
      
      <a href="#" onclick="show_hide(document.getElementById('container1'))">Link1</a>
      <a href="#" onclick="show_hide(document.getElementById('container2'))">Link2</a>

      Comment


      • #4
        Any suggestions? I'm still toying around and not getting this to work right.

        Comment

        Working...
        X