Script etc. zum zyklischen Anzeigen für Websites in Firefox?

**Ceos** · 07.03.2018, 14:02

EDITIERT, BITTE GENAU AUF DIE EDIT MARKIERUNG ACHTEN

Code:

<!--
// Released under the GPL license
// http://www.opensource.org/licenses/gpl-license.php
//
// **********************************************************************
// This program is distributed in the hope that it will be useful, but
// WITHOUT ANY WARRANTY; without even the implied warranty of
// MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. 
// **********************************************************************
-->
<html lang="en">
  <head>
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js?ver=3.0.1"></script>
    <script type="text/javascript">
      $(document).ready(function () {  //start after HTML, images have loaded
         alert("LAUNCHING");
        var InfiniteRotator = 
        {
          init: function()
          {
            //initial fade-in time (in milliseconds)
            var initialFadeIn = 1000;
            
            //interval between items (in milliseconds)
            var itemInterval = 5000;
            
            //cross-fade time (in milliseconds)
            var fadeTime = 2500;
            
            //count number of items
            var numberOfItems = $('.rotating-item').length;
      
            //set current item
            var currentItem = 0;
      
            //show first item
            $('.rotating-item').eq(currentItem).fadeIn(initialFadeIn);
            alert("PREPARED");
      
            //loop through the items    
            var infiniteLoop = setInterval(function(){
              $('.rotating-item').eq(currentItem).fadeOut(fadeTime);
               alert("ROTATING");
              if(currentItem == numberOfItems -1){
                currentItem = 0;
              }else{
                currentItem++;
              }
              $('.rotating-item').eq(currentItem).fadeIn(fadeTime);
      
            }, itemInterval); 
            alert("DONE");
          } 
        };
      
        InfiniteRotator.init();
        
      });
    </script>    <meta charset="utf-8" />
    <title>Infinite Rotating Images Using jQuery (JavaScript) - Unstyled</title>
  </head>
  <body>

    <h1>Infinite Rotating Images Using jQuery (JavaScript) - Unstyled</h1>
    <div id="rotating-item-wrapper">
      <div class="rotating-item"><object type="text/html" data="http://www.chartjs.org/samples/latest/charts/polar-area.html" width="980" height="347" /></div>
      <div class="rotating-item"><object type="text/html" data="http://www.chartjs.org/samples/latest/charts/line/stepped.html" width="980" height="347" /></div>
      <div class="rotating-item"><object type="text/html" data="http://www.chartjs.org/samples/latest/charts/bar/horizontal.html" width="980" height="347" /></div>
    </div>
   </body>

ACHTUNG: da sind alerts drinne zum debuggen, einfach nur die alert zeilen löschen dann sind die meldungen weg!

VERALTET: der funktioniert aber die divs sind trotzdem nciht sichtbar aus irgendwelchen gründen die sich mir gerade noch nciht erschließen
EDIT: habe vergessen die divs mit dem inhalt reinzu packen, jetzt geht es ;D

in der script schleife wo das fadein steht, könnetst du einfach eine zeile darüber einfügen die das div neu laden lässt um den inhalt neu zu laden! sollten deine charts bereits von alleine updaten kannst du dir das sparen

PS: später kann cih dir auch noch versuchenein simples eingabefeld einzubauen, mit dem du neue charts hinzufügen kannst, aber normalerweise lädt er nur das was als <div class="rotating-item"></div> im beispiel angegeben ist und innerhalb des wrappers <div id="rotating-item-wrapper"></div> steht

HaWe · 07.03.2018, 14:18

vielen herzlichen Dank!
aber nein, keine charts wie gesagt, sondern die kompletten websites, samt ihrer ganzen Links, Einstellungen, und eingebetten Objekte, so als wenn man sie per url manuell aufruft - wie man das einsetzt oder ersetzt, verstehe ich aber noch nicht, da ich nicht weiß, was solche "items", "divs", "fadein" oder "alerts" etc. überhaupt sind, ganz zu schweigen von java oder javascript.

Die popup-Fenster müssten ntl alle raus, damit es ohne Unterbrechung automatisch durchläuft - verstehe aber absolut nicht, wie man die im Quelltext löscht (die Sprachzeilen sind mir alle völlig fremd).

Eingabefelder aber brauche ich gar nicht, ich brauche nur die genannten 5 oder 6 urls, und wenn ich mal andere brauchen sollte, dann ersetze ich sie einfach statisch im Quelltext.

**Ceos** · 07.03.2018, 18:20

aber nein, keine charts wie gesagt, sondern die kompletten websites, samt ihrer ganzen Links, Einstellungen, und eingebetten Objekte, so als wenn man sie per url manuell aufruft

das ist exakt das, ich habe nur die google charts zum testen benutzt, das sind keine bilder sondern vollwertige webseiten

popouts macht man mit sog. alerts, schmeiß einfach die ganzen "alert("BLABLA");" aus dem code raus und erstz weiter unten im body die adressen für deine wunsch-webseiten

Code:

<div class="rotating-item"><object type="text/html" data="http://www.chartjs.org/samples/latest/charts/polar-area.html" width="980" height="347" /></div>

ersetz einfach die adressen und füge neue zeilen nach belieben ein, der code passt sich automatisch an

die width und height parameter kannst du weglassen oder auf "100%" setzen damit sie bildfüllen geöffnet werden