JavaScript - Im Trying To Create A Vertical Ticker Tape Page ?

I have this horizontal news ticker which works just perfect in ie7 regarding to speed, but when looking at the same page in ie8 the speed is very slow... Has anybody else encountered this, and if yes... How do I solve this?

Code:

initialize: function(element, options) {
		this.setOptions({
			marHeight: 18,
			marWidth: 565,
			steps: 20,
			speed: 20,
			direction: 'left',
			pauseOnOver: true,
			pauseOnContainerOver: true
	    }, options);
	    this.timer = null;
	    this.textElement = null;
	    this.mooqueeElement = element;
	    this.constructMooquee();
	}

Thanks in advance :-)

First of all sorry if i have posted in the wrong forum!

Ok my problem is with an RSS ticker for my website. I am having the error
req is not defined.

Im hoping its something very simple is the script is much complete!

THIS IS THE GRAB.PHP CODE

PHP Code:
<?

    // [email]jim-jh@webcoding.co.uk[/email]
    // ticker stuff - grab remote stream


    // begin grab.php

    $_receivedRemoteData = "" ;

    $_requestedStream = $_SERVER['QUERY_STRING'];

    if ( preg_match("/http/i", $_requestedStream ) ) {

        $fp = @fopen( $_requestedStream, "r" ) ;

        if ( $fp ) {

            while ( !feof( $fp ) ) {

                $_receivedRemoteData .= @fread($fp, 1024);

            }

            @fclose($fp);

        }

    }

    header("content-type: text/xml") ;

    print $_receivedRemoteData ;

    // end grab.php


?>

THIS IS THE TICKER.PHP FILE CODE

Code:

<style>

	.headlines {
		font-family: Verdana, Arial, Helvetica, sans-serif;
		font-size: 8pt;
		font-weight: bold;
		color: #003366;
		text-decoration: none;
	}
	.headlines:hover {
		font-family: Verdana, Arial, Helvetica, sans-serif;
		font-size: 8pt;
		font-weight: bold;
		color: #003366;
		text-decoration: none;
	}
	.globalheader {
		font-family: Verdana, Arial, Helvetica, sans-serif;
		font-size: 11px;
		font-weight: bold;
		text-transform: uppercase;
		color: #990000;
		text-decoration: none;
	}
</style>

<span align="left" width="100%" id="scroller" style="align:left;z-index:99; position:relative; display;">

<span class=globalheader>BBC NEWS RSS TICKER:</span><br/>
<span class="headlines">Loading RSS feeds....</span>

</span>

<script src="ticker.js"></script>

AND THIS IS THE JS CODE WHERE I THINK THE PROBLEM MAY BE.

PHP Code:
function getRequest() {
        var con = new Array();
        var _ms_XMLHttpRequest_ActiveX = "";
        var req;
        if (window.XMLHttpRequest) {
            req = new XMLHttpRequest();
        } else if (window.ActiveXObject) {
            if (_ms_XMLHttpRequest_ActiveX) {
                req = new ActiveXObject(_ms_XMLHttpRequest_ActiveX);
            } else {
                var versions = ["Msxml2.XMLHTTP.7.0", "Msxml2.XMLHTTP.6.0", "Msxml2.XMLHTTP.5.0", "Msxml2.XMLHTTP.4.0", "MSXML2.XMLHTTP.3.0", "MSXML2.XMLHTTP","Microsoft.XMLHTTP"];
                for (var i = 0; i < versions.length ; i++) {
                    try {
                        req = new ActiveXObject(versions[i]);
                        if (req) {
                            _ms_XMLHttpRequest_ActiveX = versions[i];
                            break;
                        }
                    } catch (objException) {
                                // trap; try next one
                    }
                }
            }
        }
        con[0]=req;
        con[1]=_ms_XMLHttpRequest_ActiveX;
        return con;
    }

    function loadRSS(url) {
    //alert("running");
        try {
            if ( _ms_XMLHttpRequest_ActiveX1 ) {
                rssRequest.onreadystatechange = processRSS;
                rssRequest.open("GET", url, true);
                rssRequest.send(null);
            } else {
                if (rssRequest) {
                    rssRequest.onreadystatechange = processRSS;
                    rssRequest.open("GET", url, true);
                    rssRequest.send(null);
                }
            }
        } catch ( rssRequestException ) {}
    }


    function getChildNode( myElement, naming ) {
        return myElement.getElementsByTagName(naming)[0].firstChild.nodeValue;
    }

    function processRSS() {
        var cycle = 0;
        try {
            if (rssRequest.readyState == 4) {
                if (rssRequest.status == 200) {
                    response = rssRequest.responseXML.documentElement;
                    if ( response ) {
                        var items = response.getElementsByTagName("item");
                        for ( var i = 0 ; i < items.length; i++ )
                        {
                            var title = getChildNode(items[i],"title");
                            var desc = getChildNode(items[i],"description");
                            var link = getChildNode(items[i],"link");
                            rssItems[cycle] = title + " - " + desc;
                            linkItems[cycle] = link;
                            ++cycle;
                        }
                    }
                } else {
                    alert("There was a problem retrieving the XML data:\n" + req.statusText);
                }
            }
        } catch ( jsException ) {alert(jsException.message);}
    }

    var httpArc2                         = getRequest();
    var rssRequest                        = httpArc2[0];
    var _ms_XMLHttpRequest_ActiveX1     = httpArc2[1];

    var rssItems = new Array();
    var linkItems = new Array();


    function openWindow(url){
        window.open(url);
    }



    var storyCount = 0;
    var itemLen = 0;

    function tickTock(){

        var obj = document.getElementById("scroller");

        var myTimeout = 50;
        var str;
        var st = rssItems[storyCount];

        if ( itemLen > st.length ) {
            storyCount++;
            if ( storyCount >= rssItems.length  ) {
                storyCount = 0;
            }
            itemLen = 0;
            myTimeout=2000;
            setTimeout("tickTock()", myTimeout);
        } else {
            ++itemLen;
            str = rssItems[storyCount].toString();
            str = str.substring(0,itemLen) + "_";
            obj.innerHTML = "<span class=globalheader>BBC NEWS RSS TICKER:</span><br/><a href=\"javascript:openWindow('"+linkItems[storyCount]+"')\" class=headlines>" + str + "</a>";
            setTimeout("tickTock()", myTimeout);
        }

    }

    setTimeout("tickTock()", 3000);


    loadRSS("/grab.php?http://news.bbc.co.uk/rss/newsonline_world_edition/front_page/rss.xml"); 






IS THERE ANYONE THAT CAN HELP WITH THIS?

Hi,

I have an .aspx page which the author claims to be an RSS feed (http://gcn.com/rss-feeds/state-local.aspx). It is simply a list of links with a description for each. I am trying to embed these links into an RSS feed on my own page. I am using code from http://www.mioplanet.com/rsc/newsticker_javascript.htm to create the scrolling ticker. Do I need to do something to convert the .aspx page to an RSS feed? Please help. Thanks.

I would like to create a link from one page to another.
Easy - I know. But I would like that link to to take me to a certain part of the other page, specifically towards the bottom of the page.

Is that possible to do? And if so, what are the different ways I can specify where in the page to go? (i.e. what are the parameters that I can play with)

Thanks!

i have used a an ajax xml ticker script in my webpage
here's the link to the page where i got the script : http://www.dynamicdrive.com/dynamicindex2/cmarquee2.htm

The problem is as soon as it reaches the end of the content, It does not cycle up to the first news item immediately there is a gap of few seconds before starts showing the items again.

Right now, I am trying to use this widget from widget box to figure stuff out but its not working.
I want to make a moving ticker The text would be from a rss
This is what there source was:

<script type="text/javascript" src="http://cdn.widgetserver.com/syndication/subscriber/InsertWidget.js"></script><script type="text/javascript">if (WIDGETBOX) WIDGETBOX.renderWidget('23bf7f48-242e-489d-99b9-4a1ac7b47eac');</script>


And inside it is this... (http://cdn.widgetserver.com/syndicat...nsertWidget.js)
Code:

//
//
//
if(!window.WIDGETBOX){(function(){var D=false;var C=function(){WIDGETBOX.setPageLoaded();};var B=function(){WIDGETBOX.setPageUnloaded();};WIDGETBOX={libs:{},version:"41509",urls:{runtimeBaseUrl:"http://widgetserver.com/syndication",galleryBaseUrl:"http://www.widgetbox.com",cdnRuntimeBaseUrl:"http://cdn.widgetserver.com/syndication",cdnGalleryBaseUrl:"http://pub.widgetbox.com",metricsBaseUrl:"http://t.widgetserver.com/t",proxyBaseUrl:"http://p.widgetserver.com/p",markupRuntimeBaseUrl:"http://widgetserver.com/syndication",mobileSiteRuntimeBaseUrl:"http://m.wbx.me",linkbarBaseUrl:"http://l.wbx.me/l",imageProxyBaseUrl:"http://i.widgetserver.com"},globals:{token:"",tokenTime:0,widgets:[],widgetCount:0,pageLoaded:false,pageUnloaded:false,eventListeners:[],pageLoadListeners:[],pageUnloadListeners:[],panels:[],panelCount:0,showPanelMarks:true,suppressGetWidget:false,disableGetWidget:false,suppressQuantcast:false,enableLogging:false,disableHitTracking:false,log:"",trustedPage:false,disableInstallerMenu:false,renderInstallerMenuInline:false,anchorEl:null,vid:null,startTime:new Date().getTime()},init:function(){if(!D){D=true;if(window.WIDGETBOXLOADLISTENERS){for(i=0;i<WIDGETBOXLOADLISTENERS.length;i++){A.addPageLoadListener(WIDGETBOXLOADLISTENERS[i]);}}A.addEvent(window,"load",C);A.addEvent(window,"unload",B);if(window.WIDGETBOXINITLISTENERS){for(i=0;i<WIDGETBOXINITLISTENERS.length;i++){try{WIDGETBOXINITLISTENERS[i]();}catch(E){WIDGETBOX.logMessage(E);}}}}},namespace:function(G){G=G.replace(".","/");if(G.indexOf("WIDGETBOX/")===0){G=G.substr(10);}if(G.indexOf("POSTAPP/")===0){G=G.substr(8);}var E=G.split("/");var I=WIDGETBOX;if(E){var H;for(var F=0;F<E.length;F++){H=E[F];if(!I[H]){I[H]={};}I=I[H];}}return G;},logMessage:function(E){if(A.globals.enableLogging){A.globals.log+=E+"\n";}},newLibInfo:function(G){G=G.replace(".","/");var J=G;var H="";var F=G.lastIndexOf("/");if(F>=0){H=G.substr(0,F);J=G.substr(F+1);}H=A.namespace(H);G=H+"/"+J;var I=G.replace("/","_").toLowerCase();var E={ns:H,name:J,path:G,id:I,status:null,callback:null};return E;},load:function(I,H,J){var G=A.newLibInfo(I);if(!WIDGETBOX.libs[G.id]){WIDGETBOX.libs[G.id]=G;G.status="loading";if(H){if(!G.listeners){G.listeners=[];}G.listeners.push(H);}var E=document.createElement("script");E.id="widgetbox_lib_"+G.id;E.type="text/javascript";E.setAttribute("async","true");if(!J){E.src=WIDGETBOX.urls.runtimeBaseUrl+"/"+G.path+".js?"+WIDGETBOX.version;}else{E.src=WIDGETBOX.urls.cdnRuntimeBaseUrl+"/"+G.path+".js?"+WIDGETBOX.version;}var F=document.documentElement.firstChild;if(!F||(F.nodeName&&F.nodeName.toLowerCase().indexOf("comment")>-1)){F=document.getElementsByTagName("head")[0];}F.appendChild(E);}else{G=WIDGETBOX.libs[G.id];if(H){if(G.status=="ready"){try{H(G);}catch(K){WIDGETBOX.logMessage(K);}}else{if(!G.listeners){G.listeners=[];}G.listeners.push(H);}}}},ready:function(F){var E=A.newLibInfo(F);if(!WIDGETBOX.libs[E.id]){WIDGETBOX.libs[E.id]=E;}E=WIDGETBOX.libs[E.id];return E.status=="ready";},setReady:function(G){var F=A.newLibInfo(G);if(!WIDGETBOX.libs[F.id]){WIDGETBOX.libs[F.id]=F;}F=WIDGETBOX.libs[F.id];F.status="ready";if(F.listeners){var E=0;for(E=0;E<F.listeners.length;E++){var H=F.listeners[E];try{H(F);}catch(I){WIDGETBOX.logMessage(I);}}}},addEvent:function(I,H,F,E){if(I.addEventListener){I.addEventListener(H,F,E);return true;}else{if(I.attachEvent){var G=I.attachEvent("on"+H,F);return G;}else{alert("Handler could not be attached");}}},removeEvent:function(H,G,F,E){if(H.removeEventListener){H.removeEventListener(G,F,E);return true;}else{if(H.detachEvent){return H.detachEvent("on"+G,F);}else{alert("Handler could not be removed");}}},addEventListener:function(E,G){if(G){if(!A.globals.eventListeners){A.globals.eventListeners={};}if(!A.globals.eventListeners[E]){A.globals.eventListeners[E]=[];}var F=A.globals.eventListeners[E];F[F.length]=G;}},notifyEventListeners:function(F){if(!A.globals.eventListeners){return ;}var G=A.globals.eventListeners[F];if(!G){return ;}for(var E=0;E<G.length;E++){var H=G[E];try{H(this);}catch(I){WIDGETBOX.logMessage(I);}}},addPageLoadListener:function(E){if(E){if(!A.globals.pageLoaded){A.globals.pageLoadListeners.push(E);}else{try{E();}catch(F){WIDGETBOX.logMessage(F);}}}},addPageUnloadListener:function(E){if(E){if(!A.globals.pageUnloaded){A.globals.pageUnloadListeners.push(E);}else{try{E();}catch(F){WIDGETBOX.logMessage(F);}}}},setPageLoaded:function(){if(A.globals.pageLoaded){return ;}A.globals.pageLoaded=true;A.removeEvent(window,"load",C);var F=A.globals.pageLoadListeners;var E;for(E=0;E<F.length;E++){try{F[E]();}catch(G){WIDGETBOX.logMessage(G);}}},setPageUnloaded:function(){if(A.globals.pageUnloaded){return ;}A.globals.pageUnloaded=true;A.removeEvent(window,"unload",B);var E=A.globals.pageUnloadListeners;for(i=0;i<E.length;i++){try{E[i]();}catch(F){WIDGETBOX.logMessage(F);}}},generateGUID:function(H,E){var I=(H)?H:Math.random;var K=(E)?36:32,M="0123456789abcdef".split(""),F,G=[];if(E){G[8]=G[13]=G[18]=G[23]="-";G[14]="4";}for(var J=0;J<K;J++){if(!G[J]){F=0|I()*16;G[J]=M[(J==19)?(F&3)|8:F];}}var L=G.join("");if(!WIDGETBOX.globals.vid){WIDGETBOX.globals.vid=L;}return L;},generateProxiedImageUrl:function(E,H,G,F){var I=E;I=this.urls.imageProxyBaseUrl+"/ip/origin=="+encodeURIComponent(I);if(H){I+="&&w=="+Math.round(H);}if(G){I+="&&h=="+Math.round(G);}if(F){I+="&&type=="+F;}I+="?token="+WIDGETBOX.globals.token;return I;},createElement:function(F,E){if(E){return E.ownerDocument.createElement(F);}else{return document.createElement(F);}}};POSTAPP=WIDGETBOX;var A=WIDGETBOX;A.init();})();}
//

//SOF: subscriber/InsertWidget.js
//
    //support rendering a widget in an element by supplying and id to the element
    WIDGETBOX.renderWidgetInElement = function(appId, parentNodeId) {
        return WIDGETBOX.renderWidget(appId, false, parentNodeId);
    },
    WIDGETBOX.renderWidget = function(appId, mode, parentNodeId) {
        if (!parentNodeId) {
            parentNodeId = "widgetbox_widget_parent_" + WIDGETBOX.globals.widgetCount++;
            document.write("<div id=\"" + parentNodeId + "\" style=\"line-height:0\"></div>");
        }
        function libReadyCallback() {
            var parentNode = document.getElementById(parentNodeId);
            if (!parentNode) {
                document.write("<div id=\"" + parentNodeId + "\" style=\"line-height:0\"><span style=\"visibility:hidden\">-</span></div>");
                parentNode = document.getElementById(parentNodeId);
            }
            WIDGETBOX.subscriber.Main.insertWidget(appId, null, parentNode, mode, null, null);
        }
        WIDGETBOX.load("subscriber.Main", libReadyCallback, true);
    };
//
//EOF: subscriber/InsertWidget.js

What do i change and do to make this work?

Hi Guys,

I am using the following script:

Code:

  	<script>
JQTWEET = {
     
    // Set twitter username, number of tweets & id/class to append tweets
    user: 'username',
    numTweets: 3,
    appendTo: '#shine-tweet-content',
 
    // core function of jqtweet
    loadTweets: function() {
        $.ajax({
            url: 'http://api.twitter.com/1/statuses/user_timeline.json/',
            type: 'GET',
            dataType: 'jsonp',
            data: {
                screen_name: JQTWEET.user,
                include_rts: true,
                count: JQTWEET.numTweets,
                include_entities: true
            },
            success: function(data, textStatus, xhr) {
 
                 var html = '<li class="tweet">TWEET_TEXT<div class="time">AGO</div></li>';
         
                 // append tweets into page
                 for (var i = 0; i < data.length; i++) {
                    $(JQTWEET.appendTo).append(
                        html.replace('TWEET_TEXT', JQTWEET.ify.clean(data[i].text) )
                            .replace(/USER/g, data[i].user.screen_name)
                            .replace('AGO', JQTWEET.timeAgo(data[i].created_at) )
                            .replace(/ID/g, data[i].id_str)
                    );
                 }                 
            }  
 
        });
         
    },
     
         
    /**
      * relative time calculator FROM TWITTER
      * @param {string} twitter date string returned from Twitter API
      * @return {string} relative time like "2 minutes ago"
      */
    timeAgo: function(dateString) {
        var rightNow = new Date();
        var then = new Date(dateString);
         
        if ($.browser.msie) {
            // IE can't parse these crazy Ruby dates
            then = Date.parse(dateString.replace(/( \+)/, ' UTC$1'));
        }
 
        var diff = rightNow - then;
 
        var second = 1000,
        minute = second * 60,
        hour = minute * 60,
        day = hour * 24,
        week = day * 7;
 
        if (isNaN(diff) || diff < 0) {
            return ""; // return blank string if unknown
        }
 
        if (diff < second * 2) {
            // within 2 seconds
            return "right now";
        }
 
        if (diff < minute) {
            return Math.floor(diff / second) + " seconds ago";
        }
 
        if (diff < minute * 2) {
            return "about 1 minute ago";
        }
 
        if (diff < hour) {
            return Math.floor(diff / minute) + " minutes ago";
        }
 
        if (diff < hour * 2) {
            return "about 1 hour ago";
        }
 
        if (diff < day) {
            return  Math.floor(diff / hour) + " hours ago";
        }
 
        if (diff > day && diff < day * 2) {
            return "yesterday";
        }
 
        if (diff < day * 365) {
            return Math.floor(diff / day) + " days ago";
        }
 
        else {
            return "over a year ago";
        }
    }, // timeAgo()
     
     
    /**
      * The Twitalinkahashifyer!
      * http://www.dustindiaz.com/basement/ify.html
      * Eg:
      * ify.clean('your tweet text');
      */
    ify:  {
      link: function(tweet) {
        return tweet.replace(/\b(((https*\:\/\/)|www\.)[^\"\']+?)(([!?,.\)]+)?(\s|$))/g, function(link, m1, m2, m3, m4) {
          var http = m2.match(/w/) ? 'http://' : '';
          return '<a class="twtr-hyperlink" target="_blank" href="' + http + m1 + '">' + ((m1.length > 25) ? m1.substr(0, 24) + '...' : m1) + '</a>' + m4;
        });
      },
 
      at: function(tweet) {
        return tweet.replace(/\B[@?]([a-zA-Z0-9_]{1,20})/g, function(m, username) {
          return '<a target="_blank" class="twtr-atreply" href="http://twitter.com/intent/user?screen_name=' + username + '">@' + username + '</a>';
        });
      },
 
      list: function(tweet) {
        return tweet.replace(/\B[@?]([a-zA-Z0-9_]{1,20}\/\w+)/g, function(m, userlist) {
          return '<a target="_blank" class="twtr-atreply" href="http://twitter.com/' + userlist + '">@' + userlist + '</a>';
        });
      },
 
      hash: function(tweet) {
        return tweet.replace(/(^|\s+)#(\w+)/gi, function(m, before, hash) {
          return before + '<a target="_blank" class="twtr-hashtag" href="http://twitter.com/search?q=%23' + hash + '">#' + hash + '</a>';
        });
      },
 
      clean: function(tweet) {
        return this.hash(this.at(this.list(this.link(tweet))));
      }
    } // ify
 
     
};
 
 
 
 
// start jqtweet!
JQTWEET.loadTweets();
</script>

To load the latest three tweets from a particular twitter account.

I am trying to use newsticker.js to only display one at a time, and fade between different the three tweets.

However, this is not working, it is working on any normal UL's but not these created using javascript.

The page in question is at http://www.garethhardy.com/Shine/

Thanks in advance for any help guys.

Dan

I'm performing a little maintenance on my news scroller. You can see the scroller on http://www.hogwarts-rpg.net (it's on the right side).

Here's the JavaScript:
Code:

var pos = 300;
var scrollTimer;
function scroll()
{

  if (!document.getElementById)
  {
    return;
  }
  
  var obj = document.getElementById("newsText");
  
  pos -= 1;
  
  if (pos < 0 - obj.offsetHeight)
  {
    
    pos = 300;
    
  }
  
  obj.style.top = pos + "px"; 
  
  scrollTimer = window.setTimeout(scroll,60);
  
  var myNewsText = document.getElementById("newsText");

  myNewsText.onmouseover = function(){window.clearTimeout(scrollTimer);}
  
  myNewsText.onmouseout = function(){scroll();}
  
}

window.onload = scroll;

Here's the CSS:
Code:

/******* NEWS TICKER *******/

#newsBody {
  width: 200px;
  height: 300px;
  color: #000000;
  font-weight: bold;
  background-image: url(/images/misc/parchment-scroller-background2.jpg);
  background-repeat: no-repeat;
}
          
/******* LINK COLORS FOR THE TICKER *******/

#newsBody a:link, #newsBody a:visited, #newsBody a:active { text-decoration: underline; color: #000000; }
#newsBody a:hover { text-decoration: underline; color: #0000FF; }
          
/******* WHERE THE ACTUAL TEXT APPEARS *******/
  
#newsWindow {
   width: 100px;
   height: 230px;
   overflow: hidden;
   position: absolute;
   top: 200px;
   left: 50px;
}

#newsText {
   width: 100px;
   position: relative;
   top: 25px;
   font-size: x-small;
}

Basically, I'm trying to make it where it A) resets quicker when it's done with a full scroll-through, and B) where it doesn't scroll up past its containing div (newsWindow in this scenario). I'm sure I'm missing something so simple, but I've been working on it all night without much headway, and I'm exhausted, so there's my excuse. I know that having pos set to reset at 300 might cause a delay in the text showing itself again, but that's to give the effect that it goes "all the way around," if you know what I mean. Even with it not resetting so high, the function still takes longer to reset than I would like it to.

Hello,

I built a fairly simple page using mioplanet's javascript code for a news ticker. It works fairly well on Chrome, Firefox, Safari and IE7, but IE8 and IE9 can't display it properly.

The website is here, and I ran it through w3c validator that pointed out multiple errors with divs nor properly closed (> missing), but on the code they're all there. I suspect the js is doing something funny, but I don't have enough knowledge to understand it.

I'm posting the js code as customised by me:

Code:

TICKER1_CONTENT = document.getElementById("TICKER1").innerHTML;
 
TICKER1_RIGHTTOLEFT = false;
TICKER1_SPEED = 5;
TICKER1_STYLE = "font-family:inconsolata,courier new, courier, monospace; font-size:24px; color:#ff00cc; letter-spacing:1px";
TICKER1_PAUSED = false;

TICKER1_start();

function TICKER1_start() {
	var tickerSupported = false;
	TICKER1_WIDTH = document.getElementById("TICKER1").style.width;
	var img = "<img src=TICKER1_space.gif width="+TICKER1_WIDTH+" height=0>";

	// Firefox
	if (navigator.userAgent.indexOf("Firefox")!=-1 || navigator.userAgent.indexOf("Safari")!=-1) {
		document.getElementById("TICKER1").innerHTML = "<TABLE  cellspacing='0' cellpadding='0' width='100%'><TR><TD nowrap='nowrap'>"+img+"<SPAN style='"+TICKER1_STYLE+"' ID='TICKER1_BODY' width='100%'>&nbsp;</SPAN>"+img+"</TD></TR></TABLE>";
		tickerSupported = true;
	}
	// IE
	if (navigator.userAgent.indexOf("MSIE")!=-1 && navigator.userAgent.indexOf("Opera")==-1) {
		document.getElementById("TICKER1").innerHTML = "<DIV nowrap='nowrap' style='width:100%;'>"+img+"<SPAN style='"+TICKER1_STYLE+"' ID='TICKER1_BODY' width='100%'></SPAN>"+img+"</DIV>";
		tickerSupported = true;
	}
	if(!tickerSupported) document.getElementById("TICKER1").outerHTML = ""; else {
		document.getElementById("TICKER1").scrollLeft = TICKER1_RIGHTTOLEFT ? document.getElementById("TICKER1").scrollWidth - document.getElementById("TICKER1").offsetWidth : 0;
		document.getElementById("TICKER1_BODY").innerHTML = TICKER1_CONTENT;
		document.getElementById("TICKER1").style.display="block";
		TICKER1_tick();
	}
}

function TICKER1_tick() {
	if(!TICKER1_PAUSED) document.getElementById("TICKER1").scrollLeft += TICKER1_SPEED * (TICKER1_RIGHTTOLEFT ? -1 : 1);
	if(TICKER1_RIGHTTOLEFT && document.getElementById("TICKER1").scrollLeft <= 0) document.getElementById("TICKER1").scrollLeft = document.getElementById("TICKER1").scrollWidth - document.getElementById("TICKER1").offsetWidth;
	if(!TICKER1_RIGHTTOLEFT && document.getElementById("TICKER1").scrollLeft >= document.getElementById("TICKER1").scrollWidth - document.getElementById("TICKER1").offsetWidth) document.getElementById("TICKER1").scrollLeft = 0;
	window.setTimeout("TICKER1_tick()", 30);
}

and this is how it's referred on the html file:

Code:

<div id=tick1>
<div id="TICKER1" STYLE="overflow:hidden; width:1600px">
  text here
  </div>
<script type="text/javascript" src="webticker_1.js" language="javascript"></script>

any help much appreciated.

Thanks,

H

I've been told by many reliable sources that getting people to 'like' your site on Facebook is a great way of increasing your site traffic and getting a site ranked higher on Google and other search engines.

However, it is hard work to get it implemented correctly. What you want is to have each page individually 'liked' rather than the site as a whole. To do that can take a lot of time-consuming fiddling around.

We've created a simple piece of Javascript that allows you to create a custom 'like' button on each page of your site. Because we've had some help from other members with some bits and pieces of Javascript coding, it only seems fair to share something in return.

Prerequisites
You will need to get a Facebook Application ID from Facebook themselves. This is a unique Application ID for your domain. The easiest way to get one of these is to go to http://developers.facebook.com/docs/.../plugins/like/ and enter the details for your domain. Then click on 'GET CODE' and copy the 15 digit number from #appId. You then paste this into the Javascript as shown below.

Adding the Facebook 'like' button to each page - changes to HTML
In the <head> section of your HTML, add the following piece of code:

Code:

<script type="text/javascript" src="SocialMedia.js"></script>
<script type="text/javascript">
	
	FacebookSetup('Your page title goes here', 'image-to-show-on-Facebook.jpg');
	
</script>

At the point on the page where you actually want the 'Like' button to appear, you then add the following piece of code:

Code:

<script type="text/javascript">

	FacebookLike();

</script>

The JavaScript
Now create a JavaScript file called SocialMedia.js:

Code:

var facebookAppID = "xxxxxxxxxx"

function FacebookSetup(title, image)
{
 	var url=window.location.host + window.location.pathname;
 	document.write("<meta property='og:title' content='" + title + "' />");
	document.write("<meta property='og:type' content='article' />");
	document.write("<meta property='og:url' content='" + url + "' />");
	document.write("<meta property='og:image' content='" + hostname + "/images/" + image + "' />");
	document.write("<meta property='og:site_name' content='" + sitename + "' />");
	document.write("<meta property='fb:admins' content='" + facebookAppID + "' />");
}

function FacebookLike()
{
	var facebook="http://www.facebook.com/plugins/like.php?href=" + url + "&amp;layout=standard&amp;show_faces=false&amp;width=250&amp;action=like&amp;font&amp;colorscheme=light&amp;height=35";
		
	document.write("<iframe src=" + facebook + " scrolling=no height=35 frameborder=0 style=border:none; overflow:hidden; width:250px; height:35px; allowTransparency=true></iframe>");
}

Change the value in the variable facebookAppId on line one to your Application ID (as explained in the prerequisites section above).

What happens once you've implemented this?
Once you've implemented this, you should see a LIKE button on your page. If you are a Facebook user and have cookies set to always log you in, you'll find that when you click on this LIKE button, a link to your page will appear on your Facebook page, along with a thumbnail photograph as specified by you when you called FacebookSetup in your HTML code.

Other people who follow you on Facebook will then also have the link to your site appearing on their News Feed.

If you are not logged in when you click on the LIKE button, you will be prompted to log on to Facebook before the information appears on your News Feed.

What are the benefits of using JavaScript to do this, rather than writing the HTML code for each page?
Many sites have created a blanket site-wide 'LIKE' button and embedded it into their HTML. Whilst this is easy, it is limiting - the LIKE button always has the same title, the same picture and sends you to the same page on your website.

Of course, it is possible to write custom HTML for each page, but this can soon get messy and then becomes more difficult to maintain.

As an alternative, this JavaScript is simple and tidy.

The code makes it simple to create unique Facebook 'likes' for each page, with custom text and custom images. It also keeps your HTML tidy, thereby making it easy to maintain in the future.

Hope this helps, folks.

I want to use javasript to create a new html page named from a text field in a form. Then I want to use javasript to copy all of the form fields to the new html page that was created using javascripting. I am creating a user are using a Javascript password login. With most of them the page is the user name or password. So this is why I am looking to do this. I use web 1000 a free host and they will only let me use javascripting. Any info or help would be great thank you

http://turtle-tv.com

I already have the server time (top left) in a live format but this other bit is a bit much for me as I know little to nothing about JS and the code in question isnt mine.

Anyway, the bit in the parenthesis which depending on the current server time will read Lights on in ??? or Lights off in ??? I would like to have turned in to a liver ticker while keeping all of it's current functionality.

Like lets say it was 7:59:59pm EST time the message in the parenthesis would read (Lights off in 1 sec) then come 8:00:00pm the message would do a live rollover to read (Lights on in 11 Hrs, 30 Mins & 0 Secs) then count down from there and then come lets say 7:39:59am EST the message would read (Lights on in 1 Sec) and come 7:30:00am EST the message would roll over to the lights off message.

If this is something you can do then great but if not then thankyou for at least reading my post.

If you are able to do this and can improve on existing code for the liver server clock then please do that as well as there's some redundant code I don't even need for stuff liek the day etc since I'm just displaying as hh:mm am/pm clock in a 12hr format.

Code:

<head>
<title>Niko's Live 24/7 Video Broadcast</title>

<script type="text/javascript">

var weekdaystxt=["Sun", "Mon", "Tues", "Wed", "Thurs", "Fri", "Sat"]

function showLocalTime(container, servermode, offsetMinutes, displayversion){
if (!document.getElementById || !document.getElementById(container)) return
this.container=document.getElementById(container)
this.displayversion=displayversion
var servertimestring=(servermode=="server-php")? '<? print date("F d, Y H:i:s", time())?>' : (servermode=="server-php")? '<!--#config timefmt="%B %d, %Y %H:%M:%S"--><!--#echo var="DATE_LOCAL" -->' : '<%= Now() %>'
this.localtime=this.serverdate=new Date(servertimestring)
this.localtime.setTime(this.serverdate.getTime()+offsetMinutes*60*1000) //add user offset to server time
this.updateTime()
this.updateContainer()
}

showLocalTime.prototype.updateTime=function(){
var thisobj=this
this.localtime.setSeconds(this.localtime.getSeconds()+1)
setTimeout(function(){thisobj.updateTime()}, 1000) //update time every second
}

showLocalTime.prototype.updateContainer=function(){
var thisobj=this
if (this.displayversion=="long")
this.container.innerHTML=this.localtime.toLocaleString()
else{
var hour=this.localtime.getHours()
var minutes=this.localtime.getMinutes()
var seconds=this.localtime.getSeconds()
var ampm=(hour>=12)? "pm" : "am"
var dayofweek=weekdaystxt[this.localtime.getDay()]
<!--
// this.container.innerHTML=formatField(hour, 1)+":"+formatField(minutes)+":"+formatField(seconds)+" "+ampm+" ("+dayofweek+")"
this.container.innerHTML=formatField(hour, 1)+":"+formatField(minutes)+""+ampm+""
// -->
}
setTimeout(function(){thisobj.updateContainer()}, 1000) //update container every second
}

function formatField(num, isHour){
if (typeof isHour!="undefined"){ //if this is the hour field
var hour=(num>12)? num-12 : num
return (hour==0)? 12 : hour
}
return (num<=9)? "0"+num : num//if this is minute or sec field
}

</script>
</head>

<body background="./smalls_file_mainBg_1919366_7636654_l.jpg">
<font size="2" color="FFFF00" style="background: #181818;">Time Now: <span id="timecontainer">Loading...</span></font>

<script type="text/javascript">
new showLocalTime("timecontainer", "server-php", 0, "short")
</script>

<?php
$lights_on = '7:30am';
$lights_off = '8pm';
$time = lights_on_off(time(), $lights_on, $lights_off);
?>

<center>
<font size="5" color="FFFF00" style="background: #181818;">
Lights out from <?php echo $lights_off; ?> to <?php echo $lights_on; ?> <?php
 echo date('T');
?> (Lights <?php
echo $time['n_state'];
?> in <?php
$h = ($time['remaining']['m'] + 1 ==60) ? $time['remaining']['h'] + 1 : $time['remaining']['h'];
$m = ($time['remaining']['m'] + 1 ==60) ? 0 : $time['remaining']['m'];
$s = ($time['remaining']['m'] + 1 ==60) ? 0 : $time['remaining']['s'];
echo ($h>1) ? $h . ' Hrs, ' : (($h==1) ? $h . ' Hr, ' : ' ');
echo ($m>1) ? $m . ' Mins & ' : (($m==1) ? $m . ' Min & ' : ' ');
echo ($s>1) ? $s . ' Secs' : (($s==1) ? $s . ' Sec' : '0 Secs');
?>
) !</font></center>

<?php

function lights_on_off($time, $lights_on, $lights_off){
  $time = (isset($time)) ? $time :  time();

  $d_lights_on = strtotime($lights_on);
  $d_lights_off = strtotime($lights_off);

  $secs_lights_on = (date("G",$d_lights_on)*60 + date("i",$d_lights_on))*60 + date("s",$d_lights_on);
  $secs_lights_off = (date("G",$d_lights_off)*60 + date("i",$d_lights_off))*60 + date("s",$d_lights_off);

  $secs = (date("G",$time)*60 + date("i",$time))*60 + date("s",$time);

  $c_state = ($secs_lights_on < $secs && $secs < $secs_lights_off) ? 'on' : 'off';
  $n_state = ($secs_lights_on < $secs && $secs < $secs_lights_off) ? 'off' : 'on';

  $next_switch = ($secs_lights_on < $secs && $secs_lights_off > $secs) ? $secs_lights_off : ($secs_lights_on + 60*60*24);
  $next_switch = ($next_switch > ($secs+60*60*24)) ? $next_switch - (60*60*24) : $next_switch;
  $time_rem = $next_switch - $secs;

  $h = floor($time_rem/(60*60));
  $m = floor(($time_rem-($h*60*60))/60);
  $s = $time_rem-($h*60*60)-($m*60);

  return array('c_state' => $c_state,'n_state' => $n_state, 'remaining' => array('secs' => $next_switch, 'h' => $h, 'm' => $m, 's' => $s));
}

?>

<center>
<object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" width="600" height="523" id="utv451302">
<param name="flashvars" value="autoplay=false&amp;brand=embed&amp;cid=1919366"/><param name="allowfullscreen" value="true"/>
<param name="allowscriptaccess" value="always"/><param name="movie" value="http://www.ustream.tv/flash/live/1/1919366"/>
<embed flashvars="autoplay=false&amp;brand=embed&amp;cid=1919366" width="625" height="545" allowfullscreen="true" allowscriptaccess="always" 
id="utv451302" name="utv_n_740840" src="http://www.ustream.tv/flash/live/1/1919366" type="application/x-shockwave-flash" /></object>
&nbsp;
<iframe scrolling="no" height="523" frameborder="0" width="576" src="./prochatrooms/index.php"></iframe>
</center>
</body>

I have now go an applet from http://castleamber.com/amberticker.html, I have contacted the publisher and asked whether ther is a way to add line/streaming text from a textarea into he applet at runtime, however they are not responding as yet.

If possible could someone tell me how I would use a repaint() case statement in this applet in order to get the value of the textarea to reflect in the ticker.

Any code I do use will have all compliments to the creators and those who have helped along the way.

Thank you

I got a code from Javascriptkit.com found he http://www.javascriptkit.com/script/...mlticker.shtml

I'm using PHP and arrays to display the HTML with a foreach loop. All that displays is the box that is supposed to have the content. Here's my PHP code:

Code:

$stats = array(
					   $txt[95] => $context['common_stats']['total_posts'],
					   $txt[64] => $context['common_stats']['total_topics'],
					   $txt[659] => $context['latest_post']['link'],
					   $txt[656] => $context['common_stats']['latest_member']
					   );
		echo '<div id="myhtmlticker" class="tickerstyle">';
		
			foreach($stats as $key => $value){
				echo '<div class="messagediv"><b>', $key ,':</b> ', $value ,'</div>';
			}
              echo '</div>';

I've placed the javascipt code in my head area of my html.