Slideshow placeret i en td i en tabel?

<ole>

Ja, det kan man godt  :)

/mvh
</bole>

:-)) kan du henvise til et script eller har du noget der kan bruges

Jeg aner jo ikke, hvad det skal kunne - et slideshow kan være mange ting  =)
Der er meget ofte spørgsmål om slideshows i denne og (D)HTML-kategorien - og såvidt jeg husker, har roenving skrevet et, der er let at instantiere flere gange. Mon ikke du kunne finde noget ved at søge lidt?

jeg har søgt rundt på eksperten, men ikke lige fundet præcis det jeg ønsker - men jeg kigger lige hvad roenving har svaret på.

Det jeg er ude efter er at, - lave et bibliotek der indeholder billeder til den første <td> et til den anden <td> osv. og et script der så kigger ned i de forskellige biblioteker og laver et lille slideshow der så kører i hver af de 4 tdér

jeg kan ikke finde noget af roenvings

- forklar 'slideshow'

f.eks 5 billeder der hentes ind fra et bibliotek og fader ind og ud i den samme td i vilkårlig rækkefølge

jeg har fundet noget her, men kan ikke lige se hvordan jeg skal komme videre med at lave det til f.eks 5 billeder og placere det i en td:
http://www.dynamicdrive.com/dynamicindex14/fadeinslideshow.htm her er koden:
<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]=["photo1.jpg", "", ""] //plain image syntax
fadeimages[1]=["photo2.jpg", "http://www.cssdrive.com", ""] //image with link syntax
fadeimages[2]=["photo3.jpg", "http://www.javascriptkit.com", "_new"] //image with link and target syntax

var fadeimages2=new Array() //2nd array set example. Remove or add more sets as needed.
//SET IMAGE PATHS. Extend or contract array as needed
fadeimages2[0]=["photo1.jpg", "", ""] //plain image syntax
fadeimages2[1]=["photo2.jpg", "http://www.cssdrive.com", ""] //image with link syntax
fadeimages2[2]=["photo3.jpg", "http://www.javascriptkit.com", "_new"] //image with link and target 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==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>

<script type="text/javascript">
//new fadeshow(IMAGES_ARRAY_NAME, slideshow_width, slideshow_height, borderwidth, delay, pause (0=no, 1=yes), optionalRandomOrder)
new fadeshow(fadeimages, 140, 225, 0, 3000, 1, "R")
new fadeshow(fadeimages2, 140, 225, 0, 3000, 0)

</script>

Den sidste script-blok placerer du med eet kald i hver sin td ...

-- de forskellige filnavne skal ind i de arrays, der findes for oven ...

-- og du kan ikke henvise til en mappe, men skal have udskrevet de nøjagtige filnavne (men det kan du jo gøre serverside !-)

Hvordan laver man et kald? og med hensyn til de arrays - kan jeg bare lave nogle flere, - altså noget lignende dette:
var fadeimages=new Array()
//SET IMAGE PATHS. Extend or contract array as needed
fadeimages[0]=["photo1.jpg", "", ""] //plain image syntax
fadeimages[1]=["photo2.jpg", "http://www.cssdrive.com", ""] //image with link syntax
fadeimages[2]=["photo3.jpg", "http://www.javascriptkit.com", "_new"] //image with link and target syntax

var fadeimages2=new Array() //2nd array set example. Remove or add more sets as needed.
//SET IMAGE PATHS. Extend or contract array as needed
fadeimages2[0]=["photo1.jpg", "", ""] //plain image syntax
fadeimages2[1]=["photo2.jpg", "http://www.cssdrive.com", ""] //image with link syntax
fadeimages2[2]=["photo3.jpg", "http://www.javascriptkit.com", "_new"] //image with link and target syntax

var fadeimages3=new Array() //3rd array set example. Remove or add more sets as needed.
//SET IMAGE PATHS. Extend or contract array as needed
fadeimages2[0]=["photo1.jpg", "", ""] //plain image syntax
fadeimages2[1]=["photo2.jpg", "http://www.cssdrive.com", ""] //image with link syntax
fadeimages2[2]=["photo3.jpg", "http://www.javascriptkit.com", "_new"] //image with link and target syntax


var fadebgcolor="white"

og så en hel masse og derefter
<script type="text/javascript">
//new fadeshow(IMAGES_ARRAY_NAME, slideshow_width, slideshow_height, borderwidth, delay, pause (0=no, 1=yes), optionalRandomOrder)
new fadeshow(fadeimages, 140, 225, 0, 3000, 1, "R")
new fadeshow(fadeimages2, 140, 225, 0, 3000, 0)
new fadeshow(fadeimages3, 140, 225, 0, 3000, 0)
</script>

Nej, til sidst gør du i hver sin td:

<td>
<script type="text/javascript">new fadeshow(fadeimages, 140, 225, 0, 3000, 1, "R")</script></td>

<td>
<script type="text/javascript">new fadeshow(fadeimages2, 140, 225, 0, 3000, 1, "R")</script></td>

<td>
<script type="text/javascript">new fadeshow(fadeimages3, 140, 225, 0, 3000, 1, "R")</script></td>

roenving - foreløbig tak - jeg prøver det af

roenving - først må jeg lige sige at det er en asp side og tabellen er skrevet som asp, - altså response.write "table"osv.
med flere <tr> og inde i hele tabellen kommer så den <td> hvor jeg vil ha slideshowet til at køre og har gjort som du beskriver
altså: <td><script type='text/javascript'>new fadeshow(fadeimages, 140, 225, 0, 3000, 1, 'R')</script></td> men der sker ikke noget? der er slet ikke noget billede i cellen

jeg har nu prøve at fjerne al asptags og gemt den som ren html, men det ændre ikke noget - der kommer ikke noget slideshow imellem de 2 <td></td>

Hej Roenving - jeg har fået det til at virke, men denne linie
<script type="text/javascript">new fadeshow(fadeimages, 140, 225, 0, 3000, 1, "R")</script></td>

er meget specifik m.h.t. bredde og højde. Hvis man fjerne højden dur det ikke - kan man sætte noget ind der bare vælger den højde billedet har?

Roenving - du har jo svaret - så læg et svar - og kan du lige gi mig et svar på mit sidste spm om bredde og højde

Desværre kan du ikke gøre det med det specifikke script, da det arbejder med at skrive nogle tags ind i dokumentet, men kan du ikke sætte højden efter de billeder, du bruger (evt. aflæse dem med dit asp-script og så indsætte ?-)

-- els velbekomme '-)

Det var for at springe over hvor gærdet er lavest - og ikke skulle formattere de billeder der skal ind, - men bare dykke ned i en mappe og hente dem uanset størrelse, - men da det ikke er så mange skriver jeg selvfølgelig bare størrelse som de er, - men tak for hjælpen

-- de fleste nogenlunde avancerede billedbehandlingsprogrammer kan køre ændringer på billeder i en batch-kørsel, så du kan få lavet billederne i en passende størrelse uden større problemer !-)

-- og tak for point ;~}