Inhalt automatisch ändern lassen

Diese Seite verwendet Cookies. Durch die Nutzung unserer Seite erklären Sie sich damit einverstanden, dass wir Cookies setzen. Weitere Informationen

  • Inhalt automatisch ändern lassen

    Hallo!

    Ich bin schon sehr lange auf der Suche nach einem JavaScript, bei dem man einen bestimmten Seiteninhalt zu einer angegeben Zeit ändern lassen kann. Beispiel: Ich habe eine Website zu einer Fernsehserie und darauf gibt es einen Bereich, bei dem man sehen kann, wann die nächste Episode davon im Fernsehen läuft. Nur muss ich das jedes Mal, nachdem eine Episode gelaufen ist, manuell ändern. Ich hätte aber gern, dass sich der Inhalt automatisch ändert. Also z.B. bis 21:15 Uhr noch Episode 6 angezeigt wird und ab 21:15 Uhr dann schon Episode 7. Ich beherrsche aber JavaScript nicht gerade gut, bisher hatte ich nicht viel damit zu tun. Könnte mir jemand dabei helfen?

    Danke,
    Micha
  • hmmm ... denke mal, dass JS dafuer nicht gerade das non-plus-ultra ist, aber ... naja ... hab' da mal was gecodet ... schau's dir einfach an ...

    das array tickThis musst du erstellen, entweder haendisch oder du generierst diese zeilen per PHP aus ner datenbank ... deine entscheidung!!
    pass auf, dass sich die zeiten nicht ueberschneiden, also dass 2 eintraege (episoden) gleichzeitig laufen, es wird nur der letzte angezeigt werden!!

    ACHTUNG:
    document.getElementById('tickTime').firstChild.dat a ==> document.getEle...Child.data

    HTML-Quellcode

    1. <HTML>
    2. <HEAD>
    3. <title>ticker</title>
    4. <script language="javascript" type="text/javascript">
    5. function tickIt() {
    6. /*** ticker definitions ***/
    7. var tickThis = new Array();
    8. tickThis[0] = new Object();
    9. tickThis[0]['start'] = '20:15';
    10. tickThis[0]['end'] = '21:15';
    11. tickThis[0]['text'] = '1st episode';
    12. tickThis[1] = new Object();
    13. tickThis[1]['start'] = '21:15';
    14. tickThis[1]['end'] = '22:15';
    15. tickThis[1]['text'] = '2st episode';
    16. tickThis[2] = new Object();
    17. tickThis[2]['start'] = '22:15';
    18. tickThis[2]['end'] = '23:15';
    19. tickThis[2]['text'] = '3rd episode';
    20. /*** do not edit anything below here ***/
    21. var now = new Date();
    22. var nowh = now.getHours();
    23. var nowm = now.getMinutes();
    24. for (var i=0; i <= tickThis.length-1; i++) {
    25. var tickerStart = tickThis[i]['start'].split(':');
    26. var tickerEnd = tickThis[i]['end'].split(':');
    27. var render = false;
    28. if (tickerStart[0] == nowh && tickerStart[1] <= nowm && tickerEnd[0] == nowh && tickerEnd[1] > nowm) { render = true; }
    29. if (tickerStart[0] == nowh && tickerStart[1] <= nowm && tickerEnd[0] > nowh) { render = true; }
    30. if (tickerStart[0] < nowh && tickerEnd[0] > nowh) { render = true; }
    31. if (tickerStart[0] < nowh && tickerEnd[0] == nowh && tickerEnd[1] > nowm) { render = true; }
    32. if (render == true) {
    33. document.getElementById('tickTime').firstChild.data = tickThis[i]['start'] + ' - ' + tickThis[i]['end'];
    34. document.getElementById('tickText').firstChild.data = tickThis[i]['text'];
    35. } // END if
    36. } // END for
    37. window.setTimeout('tickIt()', 10000);
    38. } // END function
    39. </script>
    40. </HEAD>
    41. <BODY onLoad="tickIt()">
    42. <table style="border: 1px solid; width: 300px">
    43. <tr>
    44. <td colspan="2" style="text-align: center;">t i c k e r</td>
    45. </tr>
    46. <tr>
    47. <td id="tickTime"> - </td><td id="tickText"> - </td>
    48. </tr>
    49. </table>
    50. </BODY>
    51. </HTML>
    Alles anzeigen


    ceeyaa.mex
  • ohhh ... du hast keinen plan von HTML/JS!? oder!?

    ok, pass auf ...

    HTML-Quellcode

    1. <tr>
    2. <td id="tickTime"> - </td><td id="tickText"> - </td>
    3. </tr>

    hier wird, abhaengig von der uhrzeit, der text ausgegeben!! das "befuellen" der tabelle uebernimmt die javascript-funktion tickIt()!!

    kopiere mal meinen code in ne html-datei und fuehre diese dann einfach mal aus! aendere die eintraege

    HTML-Quellcode

    1. tickThis[0] = new Object();
    2. tickThis[0]['start'] = '20:15'; // startzeit, ab wann soll der eintrag in der tabelle angezeigt werden!!
    3. tickThis[0]['end'] = '21:15'; // endzeit, bis wann soll der eintrag in der tabelle angezeigt werden!!
    4. tickThis[0]['text'] = '1st episode'; // text, der in der zeitspanne start-endzeit angezeigt werden soll!!
    5. .
    6. .
    7. .

    um zu sehen, wann was angezeigt wird!! achte dabei auf start/end-zeiten!!

    ceeyaa.mex
  • da muss ich mich auch mal bedanken Mex, hast mir auch ein bisschen geholfen
    thx