Welcome Guest ( Log In | Register )



 
Reply to this topicStart new topic
> Vertical Marquee Using JavaScript, by The JavaScript Source
TavoxPeru
post May 28 2006, 07:55 AM
Post #1


Super Member
Group Icon

Group: [HOSTED]
Posts: 760
Joined: 8-April 06
From: Lima - Peru
Member No.: 12,579



Hi, i find this script and hope that will be useful for somebody. Text scrolls from bottom to top, pauses, then scrolls up and out of view. A link can be added, opening in a new window. Configuration is simple.

First copy the following code in a new file and name it vertical.js
CODE
/* This script and many more are available free online at
The JavaScript Source :: http://javascript.internet.com
Created by: Mike Hudson :: http://www.afrozeus.com */

/*
To change the values in the setupLinks function below.
You will notice there are two arrays for each of Titles and
Links. Currently there are 3 items in each array, but you can easily
expand on that by adding to the array. For example, to add a 4th record,
you would simply include the following 2 lines at the end of setupLinks
function:

arrLinks[3] = "someURL.htm";
arrTitles[3] = "Some title";
*/
function setupLinks() {
  arrLinks[0] = "http://forums.webdeveloper.com/forumdisplay.php?s=&forumid=3";
  arrTitles[0] = "If you have any questions, be sure to visit our forums.";
  arrLinks[1] = "http://javascript.internet.com/new/";
  arrTitles[1] = "Don't miss anything - check our new additions.";
  arrLinks[2] = "http://www.webreference.com/programming/javascript/diaries/";
  arrTitles[2] = "Want to learn JavaScript? Start at the beginning.";
}

var m_iInterval;
var m_Height;
//window.onload = wl;
var iScroll=0;

var arrLinks;
var arrTitles;

var arrCursor = 0;

var arrMax;
window.onload=wl;

function wl() {
  m_iInterval = setInterval(ontimer, 10);
  var base = document.getElementById("jump_base");

  m_Height = base.offsetHeight;

  var divi = parseInt(m_Height/5);
  m_Height = divi*5;

  var td1 = document.getElementById("td1");
  var td2 = document.getElementById("td2");
  var td3 = document.getElementById("td3");
  td1.height = m_Height-5;
  td2.height = m_Height-5;
  td3.height = m_Height-5;

  arrLinks = new Array();
  arrTitles = new Array();

  setupLinks();
  arrMax = arrLinks.length-1;
  setLink();
}
function setLink() {
  var ilink = document.getElementById("jump_link");
  ilink.innerHTML = arrTitles[arrCursor];
  ilink.href = arrLinks[arrCursor];
}
function ontimer() {
  var base = document.getElementById("jump_base");
  iScroll+=5;
  if (iScroll>(m_Height*2)) {
    iScroll=0;
    arrCursor++;
    if (arrCursor>arrMax)
      arrCursor=0;
    setLink();
  }
  if (iScroll==m_Height) {
    pause();
    m_iInterval = setTimeout(resume, 4000);
  }
  base.scrollTop=iScroll;
}
function pause() {
  clearInterval(m_iInterval);
}
function resume() {
  m_iInterval = setInterval(ontimer, 10);
}

Then copy this code into a html file, you can name it whatever you want:
CODE
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>Vertical Scroll</title>
<style type="text/css">
<!--
#jump_base {
  overflow-y:hidden;
  width: 200px;
  height: 100px;
  border: 2px dotted #000099;
  margin: auto;
  padding: 0 10px 0 10px;
  font-size: .9em;
  font-family: Verdana, Arial, sans-serif;
}

#jump_base a {
  color: #000099;
  background-color: inherit;
}

.news {
  background-color: #DDDDDD;
  color: inherit;
}
//-->
</style>
<script type="text/javascript" src="vertical.js"></script>
</head>
<body>
<div align="center">
<center>
<div id="jump_base" class="news" onmouseover="pause()" onmouseout="resume()">
  <table class="news">
    <tr>
    <td id="td1"> </td></tr>
    <tr><td id = "td2" valign="middle" align="center"><a id="jump_link" href="" target="_new"></a></td></tr>
    <tr><td id="td3"> </td></tr>
  </table>
</div>
<p><div align="center">
<font face="arial, helvetica" size"-2">Free JavaScripts provided<br>
by <a href="http://javascriptsource.com">The JavaScript Source</a></font>
</div><p>
</center>
</div>
</body>
</html>

Because all this code is copyrighted i dont remove anything of it.

best regards,
Go to the top of the page
 
+Quote Post

Reply to this topicStart new topic

Collapse

> Similar Topics

Topics Topics
  1. Getting Screen Resolution using Javascript.(8)
  2. How To Create A Popup Window With Javascript?(19)
  3. javascript vs java(12)
  4. Javascript: Disable Mouse Right-click In Browser(16)
  5. Best Way To Learn Javascript(9)
  6. Javascript: Text To Texbox And Back To Text(2)
  7. Dynamicdrive: Good Site For JavaScript Codes(5)
  8. Downloads With Javascript?(7)
  9. Javascript: Simple Slidedown Menu(2)
  10. JavaScript: Simple Dropdown Menu(1)
  11. Calling Of Functions Between Mulitple External Javascript Files(2)
  12. Javascript: Browser Detection Script(0)
  13. JavaScript: Hide And Show Any Element With CSS(5)
  14. Ever Needs To Find Out A Table Height Or With With JavaScript(2)
  15. Create And Import JavaScript Modules For A Large Script(2)
  1. JavaScript Frames & Querystring(4)
  2. JavaScript Off Redirect Script(2)
  3. I Need Help With Javascript.(7)
  4. Problems With Dynamically Loading Javascript(2)
  5. Add Text To Textarea(6)
  6. Javascript Question(4)
  7. Javascript: How Do I Create Embedded Pop-up Windows?(7)
  8. Vertical Text(1)
  9. Problem With Javascript Alert();(9)
  10. Include Function For Javascript(7)
  11. Fun With Javascript And Forms(2)
  12. Javascript Help Needed : Alert(z) Works Fine But Document.write Not(2)
  13. Javascript Changes Aren't Working.(6)


 



- Lo-Fi Version Time is now: 7th October 2008 - 02:35 AM