Ergebnis 1 bis 7 von 7

Thema: Selbst gebastelte Diashow...

  1. #1
    Azubi(ne) Avatar von OJMD
    Registriert seit
    13.03.2007
    Ort
    Heidelberg
    Beiträge
    63
    Danke
    0
    Bekam 0 mal "Danke" in 0 Postings

    Standard Selbst gebastelte Diashow...

    Hallo zusammen,

    Ich versuche hier per Zufall Bilder anzeigen zulassen, was auch klappt.
    Damit das ganze Toller wirkt möchte ich gerne dass das Bilde Ein- und Aus Fadet.
    Das heißt ich muss eigentlich nur eine Schleife basteln die in einer bestimmten Zeit die CSS Werte von 0 auf 100 setzen. Nur wie muss das dann aufgebaut sein wenn ein Bild X ms Einfadet, X Sekunden stehen bleibt und dann X ms ausfadet.

    Hier der Beispiel Code:
    Code:
    <style type="text/css">
     <!--
      img#a1 &#123;filter&#58;alpha&#40;opacity=0&#41;;-moz-opacity&#58;.0;opacity&#58;.0;&#125;
     -->
    </style>
     
    <script language="JScript">
    <!--
    Bilder = new Array&#40;"DSC00068.JPG","DSC00053.JPG","DSC00070.JPG","DSC00071.JPG","DSC02655.JPG","DSC02659.JPG"&#41;;
    var zahlneu = '';
    var zahlalt = '';
    
    function TEST&#40;&#41;
    &#123;
    while &#40;zahlneu == zahlalt&#41; &#123; zahlneu = Zufall&#40;&#41;; &#125;
    
    Bild_1.innerHTML = "<img id=\"a1\" src=Hintergrundbilder/" + Bilder&#91;zahlneu&#93; + " width=150 border=1 style=\"border-style&#58;solid;border-width&#58;2px;border-color&#58;#3366FF\">";
    
    while &#40;???&#41; &#123;
    &#123;
    	document.getElementById&#40;"a1"&#41;.style.filter  ????
    &#125;
    
    	zahlalt = zahlneu; 
    	setTimeout&#40;"TEST&#40;&#41;", 6000&#41;;
    &#125;
    function Zufall&#40;&#41;
    &#123;
    	var range = Bilder.length-1;
    	zahl = range *&#40;Math.random&#40;&#41;&#41;;
    	zahl = Math.round&#40;zahl&#41;;
    	//document.write &#40;range&#41;;
     return zahl;
    &#125;
    // -->
    </script>
    Achtung: Dies ist ein alter Thread im HTML und Webmaster Forum
    Diese Diskussion ist älter als 90 Tage. Die darin enthaltenen Informationen sind möglicherweise nicht mehr aktuell. Erstelle bitte zu deiner Frage ein neues Thema im Forum !!!!!

  2. #2
    Azubi(ne)
    Themenstarter
    Avatar von OJMD
    Registriert seit
    13.03.2007
    Ort
    Heidelberg
    Beiträge
    63
    Danke
    0
    Bekam 0 mal "Danke" in 0 Postings

    Standard

    So bin ein Stück weiter …

    Was ich jetzt nur noch bräuchte ist eigentlich nur eine Funktion die mir immer eine Variable von 0 bis 100 hoch zählt und das in beliebiger Dauer zB. 1sec. -1min.


    ...

  3. #3
    Jedi Ritter Avatar von Dodo
    Registriert seit
    26.04.2008
    Ort
    Wien
    Alter
    27
    Beiträge
    3.774
    Danke
    0
    Bekam 0 mal "Danke" in 0 Postings
    Blog-Einträge
    1

    Standard

    naja jscript kann ich nicht wirklich, aber sagen dir die begriffe Rekursives Programmiren und window.setTimeout etwas?
    Something big is coming. And there will be pirates and ninjas and unicorns...

  4. #4
    Azubi(ne)
    Themenstarter
    Avatar von OJMD
    Registriert seit
    13.03.2007
    Ort
    Heidelberg
    Beiträge
    63
    Danke
    0
    Bekam 0 mal "Danke" in 0 Postings

    Standard

    Danke Dodo, ... für diesen Post. ...

    Natürlich weis ich was das ist , meine Frage bezog sich aufs anwenden dieser.

    Gruß OJMD

  5. #5
    Forum Guru Avatar von synaptic
    Registriert seit
    20.06.2007
    Ort
    Butzbach-Wiesental
    Beiträge
    10.901
    Danke
    45
    Bekam 48 mal "Danke" in 46 Postings
    Blog-Einträge
    1

    Standard

    also zuerst mal folgender anreiz.... ich hab bisher nicht geschafft den style eines elements über das stylesheet zu ändern, da müssteste den entsprechenden fade-effekt in einign styles vorbereiten und dann die classNames des angezeigten bildes durchlaufen lassen..
    mach das was im css oben steht direkt ins img-tag rein, dann kannste über document.getElementById().style.blablubb an den style rankommen.
    dann würd ich zwe funktionen bauen, fadeIn() und fadeOut(), die entsprechend aufgerufen werden. die anzeigezeit sollte sich dann automatisch ergeben duch fadeIn und fadeOut dann würd ich nur mit einem timer arbeiten, den deklarierst du global (außerhalb von allen funktion im script-tag)
    in den einzelnen funktionen kannste dann über TIMER = setTimout(funktion, zeitinmillisekunden) initialisieren

    musste halt nur zusehen, daß der TIMER auch gecleared wird
    clearTimeout(TIMER);
    das könnte klappen, wenn du es am anfang in jede funktion reinschreibst,
    denn du rufst ja innerhalb der funktion den timer wieder auf und initialisierst ihn neu... das script soll ja bstimmt unendlich laufen ...
    ansonsten kannste ja auch irgendwo ne boolsche variable setzen, die auf true steht und anhand irgendeiner bedingung false wird....
    KEIN support via pn, email, messenger oder falsch geposteten threads
    Futter für deine Schnuffelzwerge gibts bei den Schnuffelzwergen TOP Qualität, also klicken und kaufen

  6. #6
    Azubi(ne)
    Themenstarter
    Avatar von OJMD
    Registriert seit
    13.03.2007
    Ort
    Heidelberg
    Beiträge
    63
    Danke
    0
    Bekam 0 mal "Danke" in 0 Postings

    Standard

    Hallo synaptic,

    erstmal vielen Dank für Deine ausführliche Erläuterung die mir zeigt das ich auf dem richtigen Weg bin.

    Den style über das stylesheet zu ändern habe ich hinbekommen und funktioniert super.
    Ich tue mich momentan schwer die Funktionen für fadeOut() und fadeIn() hinzubekommen, ...

    Gruß Oliver

  7. #7
    Forum Guru Avatar von synaptic
    Registriert seit
    20.06.2007
    Ort
    Butzbach-Wiesental
    Beiträge
    10.901
    Danke
    45
    Bekam 48 mal "Danke" in 46 Postings
    Blog-Einträge
    1

    Standard

    so schwer sollte des net werden(hoff ich^^)..
    ich probier hier mal sowas wie nen pseudocode hinzubekommen..
    du wolltest ja was, das bis 100 zählt... wenn ich mich recht erinnere
    Code:
    <script>
    var incount=0;  //hier benutze ich mal zwei variablen, da ich ja zur zeit net weiß, ob du des mit einer regeln könntest... ansonsten denke ich du bekommst des hin ;o&#41;
    
    var outcount=0;
    var TIMER;
    fadeIn&#40;&#41;&#123;
    document.getElementById&#40;&#41;.style.bla= "";  //hier änderste deinen Style, evtl kannste die countvariable mitnutzen...
    
    incount++;  //incount hochzählen
    TIMER=setTimeout&#40;fadeIn, 100&#41;; //in einem timeout die funktion aufrufen damit sie weiterzählt....
    
    
    if&#40;incount==100&#41;&#123;clearTimeout&#40;TIMER&#41;; incount = 0&#125; //hier prüfst du ob incount die 100 schon erreicht hat- wenn JA dann soll der TIMER gecleared werden und incount auf 0 gesetzt werden
    &#125;
    </script>
    fadeout macht an sich nix anderes.. nur die stylevergabe is dann anders, oder du zählst runter evtl kannst du ja auch die incount und outcount-variablen nutzen um sie im style zu verwenden- hab ich in die "comments" geschrieben

    ich hoff des gibt dir nen neuen denkansatz..

    wenn alles läuft poste doch hier bitte den kompletten quellcode... das fertige produkt interessiert mich, hab nur leider keine zeit des selber zu schreiben.
    KEIN support via pn, email, messenger oder falsch geposteten threads
    Futter für deine Schnuffelzwerge gibts bei den Schnuffelzwergen TOP Qualität, also klicken und kaufen

Ähnliche Themen

  1. diashow usw auf eigener hp einbinden
    Von diana im Forum HTML & CSS Forum
    Antworten: 4
    Letzter Beitrag: 22.11.2007, 12:25
  2. Diashow
    Von Dalle_112 im Forum Forum für Grafiken und Bildbearbeitung
    Antworten: 7
    Letzter Beitrag: 03.09.2007, 11:44
  3. Diashow auf dvd???
    Von Ernie im Forum Computer - Internet Forum
    Antworten: 2
    Letzter Beitrag: 10.09.2006, 20:21
  4. Diashow
    Von im Forum Flash Forum
    Antworten: 10
    Letzter Beitrag: 21.08.2006, 17:47
  5. Diashow auf Webseite
    Von Ck22 im Forum HTML & CSS Forum
    Antworten: 4
    Letzter Beitrag: 13.02.2006, 22:03

Stichworte

Berechtigungen

  • Neue Themen erstellen: Nein
  • Themen beantworten: Nein
  • Anhänge hochladen: Nein
  • Beiträge bearbeiten: Nein
  •