BilderwechselForum » Webzone » (X)HTML & CSS » Bilderwechsel
-
23.09.2009 um 13:56 Uhr
mein index sieht so aus
<title>HollywoodInternational</title> <html> <head> </head> <body> <body> <img src="http://acy.ac.ohost.de/layout/Unbenannt-1.png" width="1000" height="800" border="0" usemap="#map" /> <body bgcolor="#ffffff" leftmargin="0" topmargin="0" marginwidth="0" marginheight="0" background="http://acy.ac.ohost.de/layout/dsfsdf2.jpg"> <span style="position: absolute; left: 105; top: 540"><iframe name="navi" width="240" height="1900" src="http://acy.ac.ohost.de/navi.html" border="0" frameborder="0" marginwidth="6" marginheight="6"></iframe> <span style="position: absolute; left: 230; top: "><iframe name="home" width="570" height="2200" src="http://acy.ac.ohost.de/cutenews/news.php" border="0" frameborder="0" marginwidth="6" marginheight="6"></iframe> <script language="JavaScript1.2"> <div style="height: 100px; top100px; left: 150; width: 260; "> /*********************************************** * Flexi Slideshow- Dynamic Drive (www.dynamicdrive.com) * This notice must stay intact for use * Visit http://www.dynamicdrive.com/ for full source code ***********************************************/ var variableslide=new Array() //variableslide[x]=["path to image", "OPTIONAL link for image", "OPTIONAL text description (supports HTML tags)"] variableslide[0]=['http://acy.ac.ohost.de/layout/leighton4.png', '', ''] variableslide[1]=['http://acy.ac.ohost.de/layout/leighton67.png', ''] variableslide[2]=['http://acy.ac.ohost.de/layout/leightontr.png', '', ''] //configure the below 3 variables to set the dimension/background color of the slideshow var slidewidth='130px' //set to width of LARGEST image in your slideshow var slideheight='120px' //set to height of LARGEST iamge in your slideshow, plus any text description var slidebgcolor='#F3F3F3' //configure the below variable to determine the delay between image rotations (in miliseconds) var slidedelay=3000 ////Do not edit pass this line//////////////// var ie=document.all var dom=document.getElementById for (i=0;i<variableslide.length;i++){ var cacheimage=new Image() cacheimage.src=variableslide[i][0] } var currentslide=0 function rotateimages(){ contentcontainer='<center>' if (variableslide[currentslide][1]!="") contentcontainer+='<a href="'+variableslide[currentslide][1]+'">' contentcontainer+='<img src="'+variableslide[currentslide][0]+'" border="0" vspace="3">' if (variableslide[currentslide][1]!="") contentcontainer+='</a>' contentcontainer+='</center>' if (variableslide[currentslide][2]!="") contentcontainer+=variableslide[currentslide][2] if (document.layers){ crossrotateobj.document.write(contentcontainer) crossrotateobj.document.close() } else if (ie||dom) crossrotateobj.innerHTML=contentcontainer if (currentslide==variableslide.length-1) currentslide=0 else currentslide++ setTimeout("rotateimages()",slidedelay) } if (ie||dom) document.write('<div id="slidedom" style="width:'+slidewidth+';height:'+slideheight+'; background-color:'+slidebgcolor+'"></div>') function start_slider(){ crossrotateobj=dom? document.getElementById("slidedom") : ie? document.all.slidedom : document.slidensmain.document.slidenssub if (document.layers) document.slidensmain.visibility="show" rotateimages() } if (ie||dom) start_slider() else if (document.layers) window.onload=start_slider </script> <ilayer id="slidensmain" width=&{slidewidth}; height=&{slideheight}; bgColor=&{slidebgcolor}; visibility=hide><layer id="slidenssub" width=&{slidewidth}; left=0 top=0></layer></ilayer> <p align="center"><font face="Arial" size="-2">Free DHTML scripts provided by<br> <a href="http://www.dynamicdrive.com">Dynamic Drive</a></font></p>
-
23.09.2009 um 14:56 Uhr
Hallo Twilight361,
ein HTML Dokument verfuegt IMMER nur ueber einen <body> Tag, deines hat aber gleich 3, das kann nicht funktionieren. Du solltest dich vielleicht mal mit den HTML Grundlagen vertraut machen.
Ich hab dir die slideshow jetzt mal ganz oben hin gesetzt, das wird aber bestimmt nicht so sein, wie du es haben moechtest.
<title>HollywoodInternational</title> <html> <head> </head> <body bgcolor="#ffffff" leftmargin="0" topmargin="0" marginwidth="0" marginheight="0" background="http://acy.ac.ohost.de/layout/dsfsdf2.jpg"> <script language="JavaScript1.2"> /*********************************************** * Flexi Slideshow- Dynamic Drive (www.dynamicdrive.com) * This notice must stay intact for use * Visit http://www.dynamicdrive.com/ for full source code ***********************************************/ var variableslide=new Array() //variableslide[x]=["path to image", "OPTIONAL link for image", "OPTIONAL text description (supports HTML tags)"] variableslide[0]=['http://acy.ac.ohost.de/layout/leighton4.png', '', ''] variableslide[1]=['http://acy.ac.ohost.de/layout/leighton67.png', '', ''] variableslide[2]=['http://acy.ac.ohost.de/layout/leightontr.png', '', ''] //configure the below 3 variables to set the dimension/background color of the slideshow var slidewidth='130px' //set to width of LARGEST image in your slideshow var slideheight='120px' //set to height of LARGEST iamge in your slideshow, plus any text description var slidebgcolor='#F3F3F3' //configure the below variable to determine the delay between image rotations (in miliseconds) var slidedelay=3000 ////Do not edit pass this line//////////////// var ie=document.all var dom=document.getElementById for (i=0;i<variableslide.length;i++){ var cacheimage=new Image() cacheimage.src=variableslide[i][0] } var currentslide=0 function rotateimages(){ contentcontainer='<center>' if (variableslide[currentslide][1]!="") contentcontainer+='<a href="'+variableslide[currentslide][1]+'">' contentcontainer+='<img src="'+variableslide[currentslide][0]+'" border="0" vspace="3">' if (variableslide[currentslide][1]!="") contentcontainer+='</a>' contentcontainer+='</center>' if (variableslide[currentslide][2]!="") contentcontainer+=variableslide[currentslide][2] if (document.layers){ crossrotateobj.document.write(contentcontainer) crossrotateobj.document.close() } else if (ie||dom) crossrotateobj.innerHTML=contentcontainer if (currentslide==variableslide.length-1) currentslide=0 else currentslide++ setTimeout("rotateimages()",slidedelay) } if (ie||dom) document.write('<div id="slidedom" style="width:'+slidewidth+';height:'+slideheight+'; background-color:'+slidebgcolor+'"></div>') function start_slider(){ crossrotateobj=dom? document.getElementById("slidedom") : ie? document.all.slidedom : document.slidensmain.document.slidenssub if (document.layers) document.slidensmain.visibility="show" rotateimages() } if (ie||dom) start_slider() else if (document.layers) window.onload=start_slider </script> <div style="position: absolute; z-index: 15; top: 39px; left: 365px; width: 260px"> <ilayer id="slidensmain" width=&{slidewidth}; height=&{slideheight}; bgColor=&{slidebgcolor}; visibility=hide> <layer id="slidenssub" width="&{slidewidth};" left="0" top="0"> </layer> </ilayer> </div> <!-- <div style="position: absolute; top: 0; left: 0; z-index: 1;"> <img src="http://acy.ac.ohost.de/layout/Unbenannt-1.png" width="1000" height="800" border="0" usemap="#map" /> </div> --> <div style="position: absolute; z-index: 2; left: 95px; top: 610px"> <iframe name="navi" width="240" height="1900" src="http://acy.ac.ohost.de/navi.html" border="0" frameborder="0" marginwidth="6" marginheight="6"> </iframe></div> <div style="position: absolute; z-index: 3; left: 347px; top: 609px; height:1909px"> <iframe name="home" width="570" height="1900" src="http://acy.ac.ohost.de/cutenews/news.php" border="0" frameborder="0" marginwidth="6" marginheight="6"> </iframe> </div> </body> </html>
Denn du kannst die Slideshow nur oberhalb von http://acy.ac.ohost.de/layout/Unbenannt-1.png oder unterhalb von http://acy.ac.ohost.de/layout/Unbenannt-1.png platzieren. Ich schaetze mal, du haettest die Slideshow eher auf der Grafik http://acy.ac.ohost.de/layout/Unbenannt-1.png, oder?
Das ist nicht machbar, da du dann mit z-index arbeiten muesstest, damit die Ebenen sich ueberlagern, aber das macht das Javscript fuer die Slideshow leider nicht mit...
Liebe Gruesse
Alice... { signatur } ... -
23.09.2009 um 16:03 Uhr
Hey mit diesem script geht es aber, aber immer wenn ich dieses script benutze werden meine bilder nicht ganz angezeigt ich versteh nicht wieso ich hab schon ales probiert aber es geht einfach nciht das es des ganze bild anzeigt gibt es eine lsung fr das problem??
<div style="position: absolute; left: -700; top: -600; width: 463; height: 276"> <script type="text/javascript"> /*********************************************** * 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]=["", "", ""] //plain image syntax fadeimages[1]=["", "", ""] //plain image syntax fadeimages[2]=["", "", ""] //plain image syntax fadeimages[3]=["", "", ""] //plain image syntax fadeimages[4]=["", "", ""] //plain image syntax var fadebgcolor="transparent" ////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==1){ //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() } </script> </head> <body> <!-- Begin Animation --> <div style="position: absolute; left: 286; top: 77; width: 260; height: 276"> <script type="text/javascript"> //new fadeshow(IMAGES_ARRAY_NAME, slideshow_width, slideshow_height, borderwidth, delay, pause (0=no, 1=yes), optionalRandomOrder) new fadeshow(fadeimages, 260, 276, 0, 7000, 1, "R") </script>
-
24.09.2009 um 16:34 Uhr
hey du hatest recht ich hatte zu viele bodys drinne hat jetzt geklasppt dort wo ich es hinwollte
ein rieen dank nochmal an alle
-
25.09.2009 um 17:04 Uhr
Freut mich, dass es nun funktioniert.
[CLOSED]