Avatar billede oejvind Nybegynder
11. januar 2013 - 20:12 Der er 7 kommentarer

Vise et RSS feed med Cycle 2 (jQuery) og opdatere det hvert femte minut

Hej eksperter

Jeg vil gerne vise et RSS feed og bruge Cycle 2 til at lave dissolves mellem de enkelte artikler i feedet.

Det er lykkedes mig at hente/vise feedet med følgende kode:

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8">
    <title>Test</title>
    <!--<link rel="stylesheet" href="style.css">-->
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
    <script src="http://malsup.github.com/jquery.cycle2.js"></script>
<script type="text/javascript">
$(document).ready(function() {
$("#div-one").load("getrss.php");
var refreshId = setInterval(function() {
$("#div-one").load("getrss.php");
}, 30000);
});
</script>
  </head>
  <body>
    <div id="div-one" class="cycle-slideshow"
    data-cycle-fx="fade"
    data-cycle-speed="500"
    data-cycle-timeout="6000"
    data-cycle-slides="> div"
    ></div>
  </body>
</html>

Men det viser desværre alle artikler fra feedet på én gang og ikke enkeltvis med dissolves mellem de enkelte artikler som jeg ønsker.

Hvis jeg flytter "getrss.php" ned i "div-one" vises artiklerne som et slideshow som jeg ønsker men hvordan opdaterer jeg så feedet hvert femte minut.

Kan I hjælpe mig videre?
Avatar billede olebole Juniormester
11. januar 2013 - 22:47 #1
<ole>

Jamen, loader du ikke RSS'en hvert 30. sekund med den kode?

/mvh
</bole>
Avatar billede oejvind Nybegynder
11. januar 2013 - 22:59 #2
Jo , Ole du har helt ret. Der mangler et  "0" - der skulle naturligvis stå "300000".
Det ændrer dog desværre ikke på at mit slideshow ikke fungerer.
Avatar billede olebole Juniormester
11. januar 2013 - 23:01 #3
Prøv at lægge et link til et forsøg - sammen med en forklaring af, hvad du forventer
Avatar billede oejvind Nybegynder
12. januar 2013 - 00:12 #4
Sådan skulle det gerne være:

http://oejvind.dk/eksp/test1.php

men det opdateres desværre ikke ikke når der kommer en ny artikel i feedet.


Her er koden:

<html>
<head>
<title>Test</title>
  <script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
  <script src="http://malsup.github.com/jquery.cycle2.js"></script>

<title>Test</title>
</head>
<body>


<div id="rss-nyheder" class="cycle-slideshow"
    data-cycle-fx="fade"
    data-cycle-speed="500"
    data-cycle-timeout="6000"
    data-cycle-slides="> div"
    >
    <?php
include("functions.php");
//Runs function with feed url and number of posts as arguments
$my_rss = fetch_rss_feed('http://www.tv2oj.dk/modules/fsArticle/rss.php?source=8', 10);
?>

<?php foreach ($my_rss as $k => $v) : ?>
    <div>
    <span class="title"><b><?php echo $v['title']; ?></b></span>
    <!--<span class="date"><?php echo $v['date']; ?></span> -->
    <span class="descr"><?php echo $v['descr']; ?></span>
    <span class="enclosure"><img src="<?php echo $v['enclosure']; ?>"></span>
    </div>
<?php endforeach; ?>
</div>
</body>
</html>
Avatar billede olebole Juniormester
12. januar 2013 - 00:42 #5
Nej, dit slideshow script tager vel kun af de elementer, som ligger i DIV'et ved load.

Derudover anvender jQuery's load metode innerHTML til at indskrive elementerne i DIV'et. Derved overskrives bl.a. alle referencer til elementerne i DIV'et.

I stedet bør du nok hente den rene RSS/XML og bygge de fornødne elementer med DOM og efterfølgende indsætte dem i DIV'et med Cycle 2's add metode (eller 'command', som Cycle 2's dokumentation kalder metoder).
Avatar billede oejvind Nybegynder
12. januar 2013 - 01:07 #6
Tak Ole

Jeg er meget "grøn" og prøver lige at forstå dit svar.
Hvad mener du med at "bør du nok hente den rene RSS/XML"
Avatar billede olebole Juniormester
12. januar 2013 - 01:17 #7
I din kode i spørgsmålet, kalder jQuery getrss.php, som omdanner feed'et til HTML-elementer. I stedet bør du hente feed'et (RSS - som 'bare' er XML) direkte ind i dit HTML-dokument med JavaScript (jQuery).

Du kan så parse XML'en og indsætte HTML-elementer med Cycle 2's add 'command'. Det er dog nok ikke en realistisk opgave at kaste sig ud i, hvis man er meget grøn i JS  =)
Avatar billede Ny bruger Nybegynder

Din løsning...

Tilladte BB-code-tags: [b]fed[/b] [i]kursiv[/i] [u]understreget[/u] Web- og emailadresser omdannes automatisk til links. Der sættes "nofollow" på alle links.

Loading billede Opret Preview
Kategori
Vi tilbyder markedets bedste kurser inden for webudvikling

Log ind eller opret profil

Hov!

For at kunne deltage på Computerworld Eksperten skal du være logget ind.

Det er heldigvis nemt at oprette en bruger: Det tager to minutter og du kan vælge at bruge enten e-mail, Facebook eller Google som login.

Du kan også logge ind via nedenstående tjenester