Jump to content

Javascript ticker tape

peasepud

By peasepud,
in Help

 Share

Recommended Posts

peasepud

peasepud 59

Posted
Posted

Anyone got a good one?

 

I've written one buts its not much cop as I cant seem to hide the textbox it just stays white with a border, searched the net and cant seem to get any good ones I find incorporated into the page for some reason.

Link to comment
Share on other sites
Craig

Craig 6682

Posted
Posted

this appears to be the script they're using....

 

<script language="JavaScript" type="text/javascript">
<!--
function createClass()
{
if ((document.getElementById) && (document.body.innerHTML)) {
document.write("<div class='ticko'>");
}
else {
document.write("<div class='tickh'>");
}
}
createClass();
// -->
</script><iframe height="13" marginwidth="0" width="629" scrolling="no" src="/nol/ukfs_news/hi/front_page/ticker.stm" frameborder="0" marginheight="0"></iframe></div>

 

See if you can decipher that - i'll have a look in the morning at it when i'm more awake...

Link to comment
Share on other sites
Craig

Craig 6682

Posted
Posted

This is the html of the page which holds the ticker itself:

 

<!doctype html public "-//W3C//DTD HTML 4.0 Transitional//EN" "http://www.w3.org/TR/REC-html40/loose.dtd">
<html>
<head>
<title></title>
<meta http-equiv="content-type" content="text/html;charset=iso-8859-1" />
<link type="text/css" rel="stylesheet" href="/nol/shared/css/news.css" />

</head>

<body>
<div class="ticki"><a id="tickerAnchor" href="#" target="_top" class="tickl"></a></div>
<script language="JavaScript" type="text/javascript">
<!--
// Ticker startup
function startTicker()
{
// Define run time values
theCurrentStory     = -1;
theCurrentLength    = 0;
// Locate base objects
if (document.getElementById) {	
     theAnchorObject     = document.getElementById("tickerAnchor");
 	runTheTicker();    
  }
else {
           document.write("<style>.ticki{display:none;}.ticko{border:0px; padding:0px;}</style>");
           return true;
}
}
// Ticker main run loop
function runTheTicker()
{
var myTimeout;  
// Go for the next story data block
if(theCurrentLength == 0)
{
 theCurrentStory++;
 theCurrentStory      = theCurrentStory % theItemCount;
 theStorySummary      = theSummaries[theCurrentStory].replace(/"/g,'"');  
 theTargetLink        = theSiteLinks[theCurrentStory];
 theAnchorObject.href = theTargetLink;
 thePrefix       = "<span class=\"tickls\">" + theLeadString + "</span>";
}
// Stuff the current ticker text into the anchor
theAnchorObject.innerHTML = thePrefix + 
theStorySummary.substring(0,theCurrentLength) + whatWidget();
// Modify the length for the substring and define the timer
if(theCurrentLength != theStorySummary.length)
{
 theCurrentLength++;
 myTimeout = theCharacterTimeout;
}
else
{
 theCurrentLength = 0;
 myTimeout = theStoryTimeout;
}
// Call up the next cycle of the ticker
setTimeout("runTheTicker()", myTimeout);
}
// Widget generator
function whatWidget()
{
if(theCurrentLength == theStorySummary.length)
{
 return theWidgetNone;
}

if((theCurrentLength % 2) == 1)
{
 return theWidgetOne;
}
else
{
 return theWidgetTwo;
}
}
// -->
</script>
   

<script language="JavaScript" type="text/javascript">
<!--

var theCharacterTimeout = 50;
var theStoryTimeout     = 5000;
var theWidgetOne        = "_";
var theWidgetTwo        = "-";
var theWidgetNone       = "";
var theLeadString       = "LATEST: ";

var theSummaries = new Array();
var theSiteLinks = new Array();

var theItemCount = 4;


 theSummaries[0] = "The government decides that the UVF ceasefire is over after days of riots. More soon.";
 theSiteLinks[0] = "/1/hi/default.stm";

 theSummaries[1] = "The Millennium Dome's former lighting chief is jailed over a huge fraud.";
 theSiteLinks[1] = "/1/hi/uk/4243850.stm";

 theSummaries[2] = "Bosnian Serb war crimes suspect, Sredoje Lukic, surrenders. ";
 theSiteLinks[2] = "/1/hi/world/europe/4243810.stm";

 theSummaries[3] = "New Orleans nursing home owners charged with negligent homicide.";
 theSiteLinks[3] = "/1/hi/world/americas/4243678.stm";


startTicker();

//-->
</script>


</body>
</html>

 

It's URL is http://news.bbc.co.uk/nol/ukfs_news/hi/front_page/ticker.stm

Link to comment
Share on other sites
Craig

Craig 6682

Posted
Posted

indeedy.... :icon_lol: It is the only way to go...

 

Pud, the javascript on the BBC News site is imbedded in the header section. They've got:

 

<script src="http://newsimg.bbc.co.uk/nol/shared/js/nol4.js" language="JavaScript" type="text/javascript"></script>
<script src="http://newsimg.bbc.co.uk/nol/ukfs_news/js/av.js" language="JavaScript" type="text/javascript"></script>
<script src="http://newsimg.bbc.co.uk/nol/shared/js/csf_2.js" language="JavaScript" type="text/javascript"></script>

 

So I guess if you 'replicate' those js files on your own server and put that in the header and use the other bits i've put above, you should be ok...

 

BTW, Gol has successfully implemented it on his site, so it is possible!

Link to comment
Share on other sites
Shearergol

Shearergol 0

Posted
Posted

I guess I need to put up the workings...

 

Put the following files in a /js folder off the root of the web directory.

 

http://www.everytimeref.co.uk/js/nol4.js

http://www.everytimeref.co.uk/js/av.js

http://www.everytimeref.co.uk/js/csf_2.js

 

Added the following code into the header of the page.

 

<script src="/js/nol4.js" language="JavaScript" type="text/javascript"></script>
<script src="/js/av.js" language="JavaScript" type="text/javascript"></script>
<script src="/js/csf_2.js" language="JavaScript" type="text/javascript"></script>

 

Then added the following code into the body.

 

<script language="JavaScript" type="text/javascript">
<!--
// Ticker startup
function startTicker()
{
// Define run time values
theCurrentStory     = -1;
theCurrentLength    = 0;
// Locate base objects
if (document.getElementById) { 
    theAnchorObject     = document.getElementById("tickerAnchor");
 runTheTicker();    
 }
else {
          document.write("<style>.ticki{display:none;}.ticko{border:0px; padding:0px;}</style>");
          return true;
}
}
// Ticker main run loop
function runTheTicker()
{
var myTimeout;  
// Go for the next story data block
if(theCurrentLength == 0)
{
theCurrentStory++;
theCurrentStory      = theCurrentStory % theItemCount;
theStorySummary      = theSummaries[theCurrentStory].replace(/"/g,'"');  
theTargetLink        = theSiteLinks[theCurrentStory];
theAnchorObject.href = theTargetLink;
thePrefix       = "<span class=\"tickls\">" + theLeadString + "</span>";
}
// Stuff the current ticker text into the anchor
theAnchorObject.innerHTML = thePrefix + 
theStorySummary.substring(0,theCurrentLength) + whatWidget();
// Modify the length for the substring and define the timer
if(theCurrentLength != theStorySummary.length)
{
theCurrentLength++;
myTimeout = theCharacterTimeout;
}
else
{
theCurrentLength = 0;
myTimeout = theStoryTimeout;
}
// Call up the next cycle of the ticker
setTimeout("runTheTicker()", myTimeout);
}
// Widget generator
function whatWidget()
{
if(theCurrentLength == theStorySummary.length)
{
return theWidgetNone;
}

if((theCurrentLength % 2) == 1)
{
return theWidgetOne;
}
else
{
return theWidgetTwo;
}
}
// -->
</script>
  

<script language="JavaScript" type="text/javascript">
<!--

var theCharacterTimeout = 50;
var theStoryTimeout     = 5000;
var theWidgetOne        = "_";
var theWidgetTwo        = "-";
var theWidgetNone       = "";
var theLeadString       = "LATEST: ";

var theSummaries = new Array();
var theSiteLinks = new Array();

var theItemCount = 4;


theSummaries[0] = "Your first headline here.";
theSiteLinks[0] = "link1.html";

theSummaries[1] = "Your second headline here.";
theSiteLinks[1] = "link2.html";

theSummaries[2] = "Your third headline here.";
theSiteLinks[2] = "link3.html";

theSummaries[3] = "Your fourth headline here.";
theSiteLinks[3] = "link4.html";


startTicker();

//-->

 

Then I added this to my style.css file.

 

a.tickl{font-family:Verdana,Arial,Helvetica,sans-serif;font-size:11px;line-height:12px;text-decoration:none;color:#CCCCCC;font-weight:bold;}
a.tickl:hover{color:#6666CC;text-decoration:none;}
.ticki{width:437px;height:12px;overflow:hidden;}
.ticko{width:437px;border-top:1px solid #FFFFFF;border-bottom:1px solid #990000;padding:1px 0 4px 0;margin:4px 0 0px 0;display:block;}
.tickls{color:#FFF;font-weight:bold;}
.tickh{display:none;}

 

 

If you visit here you'll see a working version.

Link to comment
Share on other sites
Craig

Craig 6682

Posted
Posted
What have I got to do with Scunthorpe?? :lol:

33807[/snapback]

 

Hmmm, tempting.... very tempting! :nufc:

33828[/snapback]

 

remember there's an 'S' and a 'thorpe' in there as well! :nufc:

Link to comment
Share on other sites
Craig

Craig 6682

Posted
Posted

Bloody hell Cath, you're on a roll today! :lol:

 

 

*excuse me one sec while i 'supersoaker' the two cats who are fighting in my back garden and have just woken Charlotte up! :nufc:*

Link to comment
Share on other sites
catmag

catmag 337

Posted
Posted
Bloody hell Cath, you're on a roll today! :nufc:

 

 

*excuse me one sec while i 'supersoaker' the two cats who are fighting in my back garden and have just woken Charlotte up!  :nufc:*

33842[/snapback]

 

:lol:

 

Hope you didn't hurt them :nufc:

Link to comment
Share on other sites
Craig

Craig 6682

Posted
Posted

A quick spray of water up their arse from 20 feet....

 

They've left my garden pissed off, but in one piece! In the meantime, I've got a grizzly 3 year old who won't go back to sleep!!! :lol:

Link to comment
Share on other sites
catmag

catmag 337

Posted
Posted

Sit her in front of the pooter and get her to read this.......

 

 

<!doctype html public "-//W3C//DTD HTML 4.0 Transitional//EN" "http://www.w3.org/TR/REC-html40/loose.dtd">
<html>
<head>
<title></title>
<meta http-equiv="content-type" content="text/html;charset=iso-8859-1" />
<link type="text/css" rel="stylesheet" href="/nol/shared/css/news.css" />

</head>

<body>
<div class="ticki"><a id="tickerAnchor" href="#" target="_top" class="tickl"></a></div>
<script language="JavaScript" type="text/javascript">
<!--
// Ticker startup
function startTicker()
{
// Define run time values
theCurrentStory     = -1;
theCurrentLength    = 0;
// Locate base objects
if (document.getElementById) {	
     theAnchorObject     = document.getElementById("tickerAnchor");
 	runTheTicker();    
  }
else {
           document.write("<style>.ticki{display:none;}.ticko{border:0px; padding:0px;}</style>");
           return true;
}
}
// Ticker main run loop
function runTheTicker()
{
var myTimeout;  
// Go for the next story data block
if(theCurrentLength == 0)
{
 theCurrentStory++;
 theCurrentStory      = theCurrentStory % theItemCount;
 theStorySummary      = theSummaries[theCurrentStory].replace(/"/g,'"');  
 theTargetLink        = theSiteLinks[theCurrentStory];
 theAnchorObject.href = theTargetLink;
 thePrefix       = "<span class=\"tickls\">" + theLeadString + "</span>";
}
// Stuff the current ticker text into the anchor
theAnchorObject.innerHTML = thePrefix + 
theStorySummary.substring(0,theCurrentLength) + whatWidget();
// Modify the length for the substring and define the timer
if(theCurrentLength != theStorySummary.length)
{
 theCurrentLength++;
 myTimeout = theCharacterTimeout;
}
else
{
 theCurrentLength = 0;
 myTimeout = theStoryTimeout;
}
// Call up the next cycle of the ticker
setTimeout("runTheTicker()", myTimeout);
}
// Widget generator
function whatWidget()
{
if(theCurrentLength == theStorySummary.length)
{
 return theWidgetNone;
}

if((theCurrentLength % 2) == 1)
{
 return theWidgetOne;
}
else
{
 return theWidgetTwo;
}
}
// -->
</script>
   

<script language="JavaScript" type="text/javascript">
<!--

var theCharacterTimeout = 50;
var theStoryTimeout     = 5000;
var theWidgetOne        = "_";
var theWidgetTwo        = "-";
var theWidgetNone       = "";
var theLeadString       = "LATEST: ";

var theSummaries = new Array();
var theSiteLinks = new Array();

var theItemCount = 4;


 theSummaries[0] = "The government decides that the UVF ceasefire is over after days of riots. More soon.";
 theSiteLinks[0] = "/1/hi/default.stm";

 theSummaries[1] = "The Millennium Dome's former lighting chief is jailed over a huge fraud.";
 theSiteLinks[1] = "/1/hi/uk/4243850.stm";

 theSummaries[2] = "Bosnian Serb war crimes suspect, Sredoje Lukic, surrenders. ";
 theSiteLinks[2] = "/1/hi/world/europe/4243810.stm";

 theSummaries[3] = "New Orleans nursing home owners charged with negligent homicide.";
 theSiteLinks[3] = "/1/hi/world/americas/4243678.stm";


startTicker();

//-->
</script>


</body>
</html>

 

32508[/snapback]

 

 

:lol:

Link to comment
Share on other sites
Shearergol

Shearergol 0

Posted
Posted
Cheers gents,

 

you're reward is there. :nufc:

33125[/snapback]

 

Southern? :nufc:

33180[/snapback]

 

I said exactly the same thing! :nufc:

33208[/snapback]

 

Scunthorpe? its south of the water innit guv'nor? gor blimey mate.

33738[/snapback]

 

 

It's south of "some" water yes :lol:

Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
 Share
Go to topic listing
×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.

  I accept