Avatar billede landmark Nybegynder
18. december 2006 - 13:27 Der er 1 kommentar og
1 løsning

fade af billeder

kan godt se at der er stillet nogenlunde samme sp. tidligere...

jeg mangler variationen - et script hvor billederne fader af sig selv altså uden mouseover o.s.v.

- altså et script der fader 2 eller flere billeder.. og bare bliver ved med at køre af sig selv.

hvordan kan man evt. skrive stien til scriptet, så man kan ligge .js filen i en scriptmappe for sig selv..?
Avatar billede landmark Nybegynder
18. december 2006 - 14:01 #1
Det lykkedes mig at får et billede til...
hvad er det lige jeg skriver for at det næste billede skal fade ind over


<html>
<head>
<script>
to = new Array();

function fade(obj, mo, hast) {
  clearTimeout(to[obj.id]);
  if (obj.filters.alpha.opacity != mo) {
    obj.filters.alpha.opacity += (obj.filters.alpha.opacity < mo) ? 2 : -2;
    to[obj.id] = setTimeout("fade(document.all." + obj.id + ", " + mo + ", " + hast + ");", hast);
  } 
}
</script>
</head>
<body>
<img src="1.jpg" onload="fade(this, 100, 10);" onload"fade(this, 20, 50);" id="bill1" style="filter: alpha(opacity=20);">

</body>
</html>
Avatar billede landmark Nybegynder
18. december 2006 - 14:13 #2
ja ok det ka man da kalde hjælp til selvhjælp - jeg har fundet ud af det ;-)

lånte en kopi af den her...

<script language="JavaScript1.2">

//Fade-in image slideshow- By Dynamic Drive
//For full source code and more DHTML scripts, visit http://www.dynamicdrive.com
//This credit MUST stay intact for use

var slideshow_width='500px'; //SET IMAGE WIDTH
var slideshow_height='500px'; //SET IMAGE HEIGHT
var pause=1; //SET PAUSE BETWEEN SLIDE (3000=3 seconds)

var fadeimages=new Array();

//SET IMAGE PATHS. Extend or contract array as needed
fadeimages[0]="1.jpg"
fadeimages[1]="2.jpg"

////NO need to edit beyond here/////////////
var preloadedimages=new Array();
   
    for (p=0;p<fadeimages.length;p++){
        preloadedimages[p]=new Image();
        preloadedimages[p].src=fadeimages[p];
        }

    var ie4=document.all;
    var dom=document.getElementById;

    if (ie4||dom)
        document.write('<div style=" position:relative;width:'+slideshow_width+';height :'+slideshow_height+';overflow:hidden"><div id="canvas0" style=" position:absolute;width:'+slideshow_width+';height    :'+slideshow_height+';top:0;left:0;filter:alpha(opacity=10);-moz-opacity:10"></div><div id="canvas1" style=" position:absolute;width:'+slideshow_width+';height:'+slideshow_height+';top:0;left:0;filter:alpha(opacity=10);-moz-opacity:10"></div></div>');
    else
        document.write('<img name="defaultslide" src="'+fadeimages[0]+'">');

    var curpos=10;
    var degree=10;
    var curcanvas="canvas0";
    var curimageindex=0;
    var curimageindex=getUniqueNumber();
    var nextimageindex=getUniqueNumber();


    function fadepic(){
        if (curpos<100){
            curpos+=10;
            if (tempobj.filters)
                tempobj.filters.alpha.opacity=curpos;
            else if (tempobj.style.MozOpacity)
                tempobj.style.MozOpacity=curpos/100;
        }
        else{
            clearInterval(dropslide);
            nextcanvas=(curcanvas=="canvas0")? "canvas0" : "canvas1";
            tempobj=ie4? eval("document.all."+nextcanvas) : document.getElementById(nextcanvas);
            tempobj.innerHTML='<img src="'+fadeimages[nextimageindex]+'">';
            nextimageindex=getUniqueNumber();
            setTimeout("rotateimage()",pause);
        }
    }

    function rotateimage(){
        if (ie4||dom){
            resetit(curcanvas);
            var crossobj=tempobj=ie4? eval("document.all."+curcanvas) : document.getElementById(curcanvas);
            crossobj.style.zIndex++;
            var temp='setInterval("fadepic()",50)';
            dropslide=eval(temp);
            curcanvas=(curcanvas=="canvas0")? "canvas1" : "canvas0";
        }
        else
            document.images.defaultslide.src=fadeimages[curimageindex];
       
        curimageindex=(curimageindex<fadeimages.length-1)? curimageindex+1 : 0;

    }

    function randomIndex(){
        var intHighest = fadeimages.length-1;
        var intLowest = 0;
        var num;

        do {
            num = Math.random();
            num = num*intHighest;
            num = Math.round(num);
            } while ((num>intHighest) || (num<intLowest));

        return num;
    }

    function getUniqueNumber(){
        var num;

        do {
            num = randomIndex();
            } while (num == curimageindex);

        return num;
    }

    function resetit(what){
        curpos=10;
        var crossobj=ie4? eval("document.all."+what) : document.getElementById(what);
        if (crossobj.filters)
            crossobj.filters.alpha.opacity=curpos;
        else if (crossobj.style.MozOpacity)
            crossobj.style.MozOpacity=curpos/100;
    }

    function startit(){
        var crossobj=ie4? eval("document.all."+curcanvas) : document.getElementById(curcanvas);
        crossobj.innerHTML='<img src="'+fadeimages[curimageindex]+'">';
        rotateimage();
    }

    if (ie4||dom)
        window.onload=startit;
    else
        setInterval("rotateimage()",pause);

</script>
Avatar billede Ny bruger Nybegynder

Din løsning...

Tilladte BB-code-tags: [b]fed[/b] [i]kursiv[/i] [u]understreget[/u] Web- og emailadresser omdannes automatisk til links. Der sættes "nofollow" på alle links.

Loading billede Opret Preview
Kategori
Vi tilbyder markedets bedste kurser inden for webudvikling

Log ind eller opret profil

Hov!

For at kunne deltage på Computerworld Eksperten skal du være logget ind.

Det er heldigvis nemt at oprette en bruger: Det tager to minutter og du kan vælge at bruge enten e-mail, Facebook eller Google som login.

Du kan også logge ind via nedenstående tjenester