 Willkommen auf dem Portal für Mediengestalter
|
|
|
| Autor |
Nachricht |
crazylobster
Threadersteller
Dabei seit: 12.01.2010
Ort: Deep Sea
Alter: -
Geschlecht: 
|
Verfasst Di 12.01.2010 20:53
Titel problem mit setTimeout: angezeigte seite wird überschrieben |
  |
|
hi leute,
habe ein problem mit setTimeout. und zwar habe ich eine slideshow, die nach einem fade-effekt (mootools) eingeblendet wird. das klappt soweit auch. der haken ist, dass während des fade-vorgangs schon eine gewisse zeit vergeht, sodass das erste bild der galerie nur kurz erscheint. das ist nervig. deswegen möchte ich die galerie mit setTimeout erst verzögert starten. das klappt aber überhaupt nicht. die slideshow überschreibt meine seite (mit document.write?) und wird auf weissem hintergrund geöffnet. was kann ich tun? gibt es einen anderen weg, soll ich die galerie selber anpassen? weiß nur leider nicht wie? 
hier mein code:
so will ich die galerie verzögert ausführen...
| Code: | | setTimeout(function(){new fadeshow(fadeimages, 948, 292, 0, 5000, 1, "R");},1000); |
meine slideshow:
| Code: | /***********************************************
* Ultimate Fade-In Slideshow (v1.51): © Dynamic Drive (http://www.dynamicdrive.com)
* This notice MUST stay intact for legal use
* Visit http://www.dynamicdrive.com/ for this script and 100s more.
***********************************************/
var fadeimages=new Array()
//SET IMAGE PATHS. Extend or contract array as needed
fadeimages[0]=["media/images/home/newsNewBalance.png", "?category=work&name=newbalance", ""] //plain image syntax
fadeimages[1]=["media/images/home/newsHatakeBlog.jpg", "http://link/", ""] //plain image syntax
fadeimages[2]=["media/images/home/newsNewBalance2.jpg", "?category=work&name=newbalance", ""] //plain image syntax
fadeimages[3]=["media/images/home/newsAndreasBintz.jpg", "?category=work&name=andreasbintz", ""] //plain image syntax
var fadebgcolor="white"
////NO need to edit beyond here/////////////
var fadearray=new Array() //array to cache fadeshow instances
var fadeclear=new Array() //array to cache corresponding clearinterval pointers
var dom=(document.getElementById) //modern dom browsers
var iebrowser=document.all
function fadeshow(theimages, fadewidth, fadeheight, borderwidth, delay, pause, displayorder){
this.pausecheck=pause
this.mouseovercheck=0
this.delay=delay
this.degree=10 //initial opacity degree (10%)
this.curimageindex=0
this.nextimageindex=1
fadearray[fadearray.length]=this
this.slideshowid=fadearray.length-1
this.canvasbase="canvas"+this.slideshowid
this.curcanvas=this.canvasbase+"_0"
if (typeof displayorder!="undefined")
theimages.sort(function() {return 0.5 - Math.random();}) //thanks to Mike (aka Mwinter) :)
this.theimages=theimages
this.imageborder=parseInt(borderwidth)
this.postimages=new Array() //preload images
for (p=0;p<theimages.length;p++){
this.postimages[p]=new Image()
this.postimages[p].src=theimages[p][0]
}
var fadewidth=fadewidth+this.imageborder*2
var fadeheight=fadeheight+this.imageborder*2
if (iebrowser&&dom||dom) //if IE5+ or modern browsers (ie: Firefox)
document.write('<div id="master'+this.slideshowid+'" style="position:relative;width:'+fadewidth+'px;height:'+fadeheight+'px;overflow:hidden;"><div id="'+this.canvasbase+'_0" style="position:absolute;width:'+fadewidth+'px;height:'+fadeheight+'px;top:0;left:0;filter:progid:DXImageTransform.Microsoft.alpha(opacity=10);opacity:0.1;-moz-opacity:0.1;-khtml-opacity:0.1;background-color:'+fadebgcolor+'"></div><div id="'+this.canvasbase+'_1" style="position:absolute;width:'+fadewidth+'px;height:'+fadeheight+'px;top:0;left:0;filter:progid:DXImageTransform.Microsoft.alpha(opacity=10);opacity:0.1;-moz-opacity:0.1;-khtml-opacity:0.1;background-color:'+fadebgcolor+'"></div></div>')
else
document.write('<div><img name="defaultslide'+this.slideshowid+'" src="'+this.postimages[0].src+'"></div>')
if (iebrowser&&dom||dom) //if IE5+ or modern browsers such as Firefox
this.startit()
else{
this.curimageindex++
setInterval("fadearray["+this.slideshowid+"].rotateimage()", this.delay)
}
}
function fadepic(obj){
if (obj.degree<100){
obj.degree+=10
if (obj.tempobj.filters&&obj.tempobj.filters[0]){
if (typeof obj.tempobj.filters[0].opacity=="number") //if IE6+
obj.tempobj.filters[0].opacity=obj.degree
else //else if IE5.5-
obj.tempobj.style.filter="alpha(opacity="+obj.degree+")"
}
else if (obj.tempobj.style.MozOpacity)
obj.tempobj.style.MozOpacity=obj.degree/101
else if (obj.tempobj.style.KhtmlOpacity)
obj.tempobj.style.KhtmlOpacity=obj.degree/100
else if (obj.tempobj.style.opacity&&!obj.tempobj.filters)
obj.tempobj.style.opacity=obj.degree/101
}
else{
clearInterval(fadeclear[obj.slideshowid])
obj.nextcanvas=(obj.curcanvas==obj.canvasbase+"_0")? obj.canvasbase+"_0" : obj.canvasbase+"_1"
obj.tempobj=iebrowser? iebrowser[obj.nextcanvas] : document.getElementById(obj.nextcanvas)
obj.populateslide(obj.tempobj, obj.nextimageindex)
obj.nextimageindex=(obj.nextimageindex<obj.postimages.length-1)? obj.nextimageindex+1 : 0
setTimeout("fadearray["+obj.slideshowid+"].rotateimage()", obj.delay)
}
}
fadeshow.prototype.populateslide=function(picobj, picindex){
var slideHTML=""
if (this.theimages[picindex][1]!="") //if associated link exists for image
slideHTML='<a href="'+this.theimages[picindex][1]+'" target="'+this.theimages[picindex][2]+'">'
slideHTML+='<img src="'+this.postimages[picindex].src+'" border="'+this.imageborder+'px">'
if (this.theimages[picindex][1]!="") //if associated link exists for image
slideHTML+='</a>'
picobj.innerHTML=slideHTML
}
fadeshow.prototype.rotateimage=function(){
if (this.pausecheck==1) //if pause onMouseover enabled, cache object
var cacheobj=this
if (this.mouseovercheck==1)
setTimeout(function(){cacheobj.rotateimage()}, 100)
else if (iebrowser&&dom||dom){
this.resetit()
var crossobj=this.tempobj=iebrowser? iebrowser[this.curcanvas] : document.getElementById(this.curcanvas)
crossobj.style.zIndex++
fadeclear[this.slideshowid]=setInterval("fadepic(fadearray["+this.slideshowid+"])",50)
this.curcanvas=(this.curcanvas==this.canvasbase+"_0")? this.canvasbase+"_1" : this.canvasbase+"_0"
}
else{
var ns4imgobj=document.images['defaultslide'+this.slideshowid]
ns4imgobj.src=this.postimages[this.curimageindex].src
}
this.curimageindex=(this.curimageindex<this.postimages.length-1)? this.curimageindex+1 : 0
}
fadeshow.prototype.resetit=function(){
this.degree=10
var crossobj=iebrowser? iebrowser[this.curcanvas] : document.getElementById(this.curcanvas)
if (crossobj.filters&&crossobj.filters[0]){
if (typeof crossobj.filters[0].opacity=="number") //if IE6+
crossobj.filters(0).opacity=this.degree
else //else if IE5.5-
crossobj.style.filter="alpha(opacity="+this.degree+")"
}
else if (crossobj.style.MozOpacity)
crossobj.style.MozOpacity=this.degree/101
else if (crossobj.style.KhtmlOpacity)
crossobj.style.KhtmlOpacity=this.degree/100
else if (crossobj.style.opacity&&!crossobj.filters)
crossobj.style.opacity=this.degree/101
}
fadeshow.prototype.startit=function(){
var crossobj=iebrowser? iebrowser[this.curcanvas] : document.getElementById(this.curcanvas)
this.populateslide(crossobj, this.curimageindex)
if (this.pausecheck==0){ //IF SLIDESHOW SHOULD PAUSE ONMOUSEOVER
var cacheobj=this
var crossobjcontainer=iebrowser? iebrowser["master"+this.slideshowid] : document.getElementById("master"+this.slideshowid)
crossobjcontainer.onmouseover=function(){cacheobj.mouseovercheck=1}
crossobjcontainer.onmouseout=function(){cacheobj.mouseovercheck=0}
}
this.rotateimage()
} |
hoffe, jemand hat ne idee!
greetz
Zuletzt bearbeitet von crazylobster am Di 12.01.2010 20:55, insgesamt 3-mal bearbeitet
|
|
| |
  |
 |
danielkussin
Dabei seit: 04.06.2008
Ort: Hamburg
Alter: 42
Geschlecht:
|
Verfasst Mi 13.01.2010 10:40
Titel Re: problem mit setTimeout: angezeigte seite wird überschrie |
|
|
Hi,
also leider ist dein Code schwierig zu lesen bzw. ein Fehler auszumachen, da es einfach zu viel Code ist. Aber ich geh mal davon aus, dass du den Code sowieso nicht geändert hast, wie es der Enttwickler geschrieben hat, sondern nur Konfigurationen vorgenommen hast, und an der entsprechenden Stelle, die Slideshow aufgerufen! Oder?
| crazylobster hat geschrieben: |
| Code: | | setTimeout(function(){new fadeshow(fadeimages, 948, 292, 0, 5000, 1, "R");},1000); |
|
Was mich etwas stutzen lässt, ist dass du mit deiner Timeout-Funktion nicht die Slideshow-Funktion aufrufst, sondern ein neues Objekt mit new erzeugst!? Sollte der Aufruf nicht wie folgt heißen?
| Code: | | setTimeout(fadeshow(fadeimages, 948, 292, 0, 5000, 1, "R"),1000); |
setTimeout Doku bei SelfHTML: http://de.selfhtml.org/javascript/objekte/window.htm#set_timeout
Vielleicht ist das ja schon der Fehler! Hast du denn den alten Funktionsaufruf (ohne Timeout) gelöscht?
Gruß Daniel
Zuletzt bearbeitet von danielkussin am Mi 13.01.2010 10:43, insgesamt 2-mal bearbeitet
|
|
| |
 |
|
|
Anzeige
|
|
|
crazylobster
Threadersteller
Dabei seit: 12.01.2010
Ort: Deep Sea
Alter: -
Geschlecht:
|
Verfasst Mi 13.01.2010 13:46
Titel
|
|
|
hi daniel,
danke erstmal für die antwort.
das mit "new" ist der code mit dem ich die slideshow normalerweise, also ohne verzögerung aufrufe. das funktioniert auch.
| Code: | | new fadeshow(fadeimages, 948, 292, 0, 5000, 1, "R"); |
und ja, habe nicht's verändert am script, sondern nur die einstellungen angepasst.
diesen "rahmen" mit function() im setTimout habe ich als möglichkeit in anderen foren gefunden, um die parameter zu übergeben. ohne passiert das nicht. dann bleibt die stelle nämlich leer. mit der jetzigen methode sehe ich zumindest die slideshow, aber leider überschreibt sie meine seite.
die selfhtml doku hab ich mir ein paarma angeschaut, hilft mir aber auch nicht weiter
grüße
|
|
| |
|
|
| |
|
|
| Ähnliche Themen |
Mit Hilfe von setTimeout auf Seite davor gelangen...
[JavaScript] setTimeout- Problem
[javascript] setTimeout?
setTimeout ausführen bei mouseover
Variablen werden überschrieben?
[JS] setTimeout einmal und dann nie wieder?
|
|
|
Du kannst keine Beiträge in dieses Forum schreiben.
Du kannst auf Beiträge in diesem Forum nicht antworten.
Du kannst an Umfragen in diesem Forum nicht mitmachen.
|
|
