I have the following RSS feed: RSS Feed
I load this feed like this:
file: rss2.php
Expand|Select|Wrap|Line Numbers
- <head>
- <link rel="stylesheet" type="text/css" href="rss.css" media="screen" />
- </head>
- <body style="margin: 0px;">
- <div id="RSS_Feed">
- <script language="JavaScript" src="http://rss.nuvini.com/list/feed2js/feed2js.php?src=http%3A%2F%2Frss.nuvini.com%2Fpublic.php%3Fop%3Drss%26id%3D-1027%26key%3D19a8dbb063bf0c30d5e74c5fb619f33255a027db&num=15&tz=+2&targ=y&utf=y" charset="UTF-8" type="text/javascript"></script>
- </div>
- </body>
Now what I want to do, is check for updates in the RSS feed, say, every 1 minute. If there are updates, I want it to display the latest feed, but I don't want it to flicker.
I understood that the way to do this is through javascript/jquery/AJAX. My knowledge of those is pretty much nonexistant, so I googled quite a bit and found some tutorials and such, but nothing seems to work the way I want for me. In the end I think at some point I had something that did refresh fine but it didn't load the CSS so I was missing the layout.
Besides the rss2 file I also have rss-testing.php, this is what I have right now whilst trying, but it's not working at all for me:
Expand|Select|Wrap|Line Numbers
- <head>
- <link rel="stylesheet" type="text/css" href="rss.css" media="screen" />
- <script language="javascript">
- function loadPageContents() {
- var AJAX = XMLHTTPRequest();
- AJAX.open('GET','rss2.php',true);
- AJAX.onreadystatechange = function() {
- if(this.readyState==4 && this.responseText) {
- document.getElementById('RSS_Feed').innerHTML = this.responseText;
- loadingPage = setTimeout('loadPageContents()',5000);
- }
- }
- AJAX.send(null);
- }
- </script>
- </head>
- <body style="margin: 0px;">
- <script language="JavaScript">
- window.onload = function () {
- var loadingPage = setTimeout('loadPageContents()',5000);
- }
- <div id="RSS_Feed">
- </div>
- </body>
If it helps, this is the code that did some refreshing without flickering (that I could see) but it missed the CSS.
Expand|Select|Wrap|Line Numbers
- <head>
- <link rel="stylesheet" type="text/css" href="rss.css" media="screen" />
- <script language="javascript" src="js/jquery-2.0.1.min.js"></script>
- </head>
- <body style="margin: 0px;">
- <script language="javascript">
- $(function() {
- startRefresh();
- });
- function startRefresh() {
- setTimeout(startRefresh,5000);
- $.get('rss2.php', function(data) {
- $('#RSS_Feed').html(data);
- });
- }
- </script>
- <div id="RSS_Feed">
- </div>
- </body>