PDA

View Full Version : Advanced RSS Ticker Multiple Feeds



rss4all
03-19-2013, 09:04 PM
1) Script Title: Advanced RSS Ticker

2) Script URL (on DD): http://www.dynamicdrive.com/dynamicindex17/rsstickerajax/index.htm

3) Describe problem: How do I include multiple RSS sources but display them still in a single output?

Thanks :)

jscheuer1
03-20-2013, 03:22 PM
demo.htm:


<!DOCTYPE html>
<html lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Advanced RSS Ticker (Ajax invocation) with multiple switch demo</title>

<script src="rssticker.js" type="text/javascript">

/***********************************************
* Advanced RSS Ticker (Ajax invocation)- Dynamic Drive DHTML code library (www.dynamicdrive.com)
* This notice MUST stay intact for legal use
* Visit Dynamic Drive at http://www.dynamicdrive.com/ for this script and 100s more
***********************************************/

</script>

<style type="text/css">

/*Sample CSS to style the four tickers in this demo*/

.tickerclass{
width: 400px;
padding: 6px;
background-color: lightyellow;
border: 1px solid #004A00;
position: absolute; /* required - do not change or override */
top: 0; /* required - do not change or override */
left: 0; /* required - do not change or override */
visibility: hidden; /* required - do not change or override */
}

#cnnbox {
background-color: lightblue; /* override styles for any given ticker via its divId */
}

.rsstitle{ /*shared class for all title elements in an RSS feed*/
font-weight: bold;
}

.rssdate{ /*shared class for all date elements in an RSS feed*/
color: gray;
font-size: 85%;
}

.rssdescription{ /*shared class for all description elements in an RSS feed*/
}

</style>

</head>
<body>
<select id="choser" onchange="switchtickers(this.value);">
<option value="1">Dynamic Drive</option>
<option value="2">CNN</option>
<option value="3">BBC</option>
</select>
<div id="rsstitles"></div><!-- div for feed titles -->
<div style="height: 400px; position: relative; overflow: hidden;"><!-- container for multiple feeds - must be position: relative -->
<script type="text/javascript">
//rssticker_ajax(RSS_id, cachetime, divId, divClass, delay, optionalswitch)
//1) RSS_id: "Array key of RSS feed in PHP script"
//2) cachetime: Time to cache the feed in minutes (0 for no cache)
//3) divId: "ID of DIV to display ticker in. DIV dynamically created"
//4) divClass: "Class name of this ticker, for styling purposes"
//5) delay: delay between message change, in milliseconds
//6) optionalswitch: "optional arbitrary" string to create additional logic in call back function

var tickers = {
ticker1: {
ticker: new rssticker_ajax("dynamicdrive", 600, "encbox", "tickerclass", 4000, "date+description"),
title: "Dynamic Drive: (Title+date+description shown)"
},
ticker2: {
ticker: new rssticker_ajax("CNN", 600, "cnnbox", "tickerclass", 3000, "date+description"),
title: "CNN News: (Title+date+description shown)"
},
ticker3: {
ticker: new rssticker_ajax("BBC", 1200, "ddbox", "tickerclass", 3500, "date+description"),
title: "BBC News: (Title+date+description shown)"
}
};

function switchtickers(which){
var id;
for(var ticker in tickers){
id = tickers[ticker].ticker.tickerid;
document.getElementById(id).style.visibility = '';
}
document.getElementById(tickers['ticker' + which].ticker.tickerid).style.visibility = 'visible';
document.getElementById('rsstitles').innerHTML = tickers['ticker' + which].title;
}
switchtickers(document.getElementById('choser').value);
</script>
</div>
<a href="http://www.dynamicdrive.com/dynamicindex17/rsstickerajax/">Advanced RSS Ticker</a>.

</body>

</html>

Feeds for this demo (code goes in bridge.php, replacing its current $rsslist array, or you can just add the feeds to the existing $rsslist array if they're not there):


// List of RSS URLs
$rsslist=array(
"CNN" => "http://rss.cnn.com/rss/cnn_topstories.rss",
"BBC" => "http://newsrss.bbc.co.uk/rss/newsonline_uk_edition/front_page/rss.xml",
"dynamicdrive" => "http://www.dynamicdrive.com/export.php?type=new"
);