• Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 280
  • Last Modified:

JavaScript News Scroller

I've developed an IFRAME named "if1". In it loads a page that must introduce a News Scroller. I like to scroll my desirect text from bottom to up, alongwith the 'pause'.  activity. On onMouseOver activity, the scrolling must pause till the onMouseOut activity is being called n the text continues scrolling from where it got paused. Could anybody plz write me the code?
0
adnan_from_hiit
Asked:
adnan_from_hiit
1 Solution
 
adnan_from_hiitAuthor Commented:
OK its been done. Here is the solution

<head>
<style type="text/css">  
#divContainer{
      position:absolute;
      width:200px;
      height:70px;
      overflow:hidden;
      top:20px;
      visibility:hidden;
}
#divContent{
      font-family:verdana;
      font-size:10px;
      position:absolute;
      cursor:default;
}      
.link {
      text-decoration:none;
      color:black;
}
.linkOver {
      font-weight:bold;
      text-decoration:none;
      color:brown;
}
</style>
<script language="JavaScript">
      var i,c=0,scrl=true;;
      function InitialiseScrollableArea(){
            i = divContainer.offsetHeight+10;      
            divContent.style.top = i;
            divContainer.style.visibility='visible';
          divContainer.style.left=0;
          divContainer.style.bottom=0;
            setInterval('ScrollText()',20);
      }
      function ScrollText() {
            if (!scrl) return;
            divContent.style.top=i--;
            if (divContent.offsetHeight < divContainer.offsetHeight) {
                  if (i == -divContainer.offsetHeight) i = divContainer.offsetHeight+10;
                  return;
            }
            
            if (Math.abs(i) > divContent.offsetHeight) {
                  i = divContainer.offsetHeight+10;      
            }
      }
</script>

</head>

<body onLoad="InitialiseScrollableArea()">

<div id="divContainer">
  <div id="divContent">
        <a href="#" onMouseOver="javascript:scrl=false;this.className='linkOver';" onMouseOut="javascript:scrl=true;this.className='link'" class="link" style="color:#67777C;">Visit our newly furnished website</a>
        <br><br><br>
        <a href="#" onMouseOver="javascript:scrl=false;this.className='linkOver';" onMouseOut="javascript:scrl=true;this.className='link'" class="link" style="color:#67777C;">Administrators click here</a>
  </div>
</div>


</body>
0
 
PAQ_ManCommented:
Question Closed, 50 points refunded.
PAQ_Man
Community Support Moderator
0
Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.

Join & Write a Comment

Featured Post

Cloud Class® Course: Microsoft Azure 2017

Azure has a changed a lot since it was originally introduce by adding new services and features. Do you know everything you need to about Azure? This course will teach you about the Azure App Service, monitoring and application insights, DevOps, and Team Services.

Tackle projects and never again get stuck behind a technical roadblock.
Join Now