sistema imatges automàtiques fet

This commit is contained in:
nau
2016-06-14 22:18:35 +02:00
parent a940c3faa8
commit dfdbf107b6
3 changed files with 22 additions and 17 deletions

View File

@@ -22,8 +22,8 @@
</head>
<body onload='OnLoadIndex();'>
<div class='own-container'>
<img id='backgroundImage0' class='own-indexBackgroundImage' src='imatges/mainBackground.jpg' />
<img id='backgroundImage1' class='own-indexBackgroundImage opacity0' src='imatges/background/background0.jpg' />
<img id='backgroundImage0' class='own-indexBackgroundImage opacity0' src='imatges/background/background1.jpg' />
<img id='backgroundImage1' class='own-indexBackgroundImage' src='imatges/background/background0.jpg' />
<div class='own-lang own-whiteText'>
<a href="#">CAT</a>
<a href='#'>CAST</a>

View File

@@ -15,25 +15,30 @@ function OnLoadDefault(){
function OnLoadIndex(){
OnLoadDefault();
var numImg=0;
var visibleImg=0;
var numImg=3;
var visibleImg=1;
setInterval(function(){
document.getElementById("backgroundImage"+visibleImg).className="own-indexBackgroundImage";
console.log(numImg);
console.log("visibleImg: " + visibleImg);
document.getElementById("backgroundImage"+visibleImg).className+=" own-opacity0";
document.getElementById("backgroundImage"+visibleImg).src="imatges/background/background"+numImg+".jpg";
if(visibleImg==0){
visibleImg=1;
}else{
visibleImg=0;
}
document.getElementById("backgroundImage"+visibleImg).className+=" own-opacity0";
document.getElementById("backgroundImage"+visibleImg).src="imatges/background/background"+numImg+".jpg";
document.getElementById("backgroundImage"+visibleImg).className="own-indexBackgroundImage";
numImg++;
if(numImg>9)
{
numImg=0;
}
}, 5000);
}, 4000);
}
function OnLoadNosaltres(){
OnLoadDefault();

18
own.css
View File

@@ -94,10 +94,10 @@ body {
left: 0px;
top: 0px;
-webkit-transition: opacity 1s ease-in-out;
-moz-transition: opacity 1s ease-in-out;
-o-transition: opacity 1s ease-in-out;
transition: opacity 1s ease-in-out;
/*-webkit-transition: opacity 0.5s ease-in-out;
-moz-transition: opacity 0.5s ease-in-out;
-o-transition: opacity 0.5s ease-in-out;
transition: opacity 0.5s ease-in-out;*/
}
}
@@ -110,13 +110,13 @@ body {
left: 0px;
top: 0px;
-webkit-transition: opacity 1s ease-in-out;
-moz-transition: opacity 1s ease-in-out;
-o-transition: opacity 1s ease-in-out;
transition: opacity 1s ease-in-out;
/*-webkit-transition: opacity 0.5s ease-in-out;
-moz-transition: opacity 0.5s ease-in-out;
-o-transition: opacity 0.5s ease-in-out;
transition: opacity 0.5s ease-in-out;*/
}
}
.own-opactity0{
.own-opacity0{
opacity: 0;
}
.own-langIndex{