|
Drugari, pocetnica sam u html i css kodiranju i molim vas da to imate na umu prilikom razmatranja mog problema 
Napisala sam u css kodu jedan mali slider-animaciju sa par fotografija i izvanredno funkcionise u svim browserima osim IE i Opere. 
Pretrazila sam sve moguce stranice i nikako se ne snalazim sa ovim filterima za animaciju.
Molim vas ako vam nije tesko da mi napisete css kodove za navedena dva browsera 
Ovo je moj kod u koji trebam to ubaciti:
.slides {
height:215px;
overflow:hidden;
position:relative;
width:895px;
}
.slides ul {
list-style:none;
position:relative;
}
/* keyframes #anim_slides */
@-webkit-keyframes anim_slides {
0% {
opacity:0;
}
6% {
opacity:1;
}
24% {
opacity:1;
}
30% {
opacity:0;
}
100% {
opacity:0;
}
}
@-moz-keyframes anim_slides {
0% {
opacity:0;
}
6% {
opacity:1;
}
24% {
opacity:1;
}
30% {
opacity:0;
}
100% {
opacity:0;
}
}
.slides ul li {
opacity:0;
position:absolute;
top:0;
/* css3 animation */
-webkit-animation-name: anim_slides;
-webkit-animation-duration: 24.0s;
-webkit-animation-timing-function: linear;
-webkit-animation-iteration-count: infinite;
-webkit-animation-direction: normal;
-webkit-animation-delay: 0;
-webkit-animation-play-state: running;
-webkit-animation-fill-mode: forwards;
-moz-animation-name: anim_slides;
-moz-animation-duration: 24.0s;
-moz-animation-timing-function: linear;
-moz-animation-iteration-count: infinite;
-moz-animation-direction: normal;
-moz-animation-delay: 0;
-moz-animation-play-state: running;
-moz-animation-fill-mode: forwards;
}
/* css3 delays */
.slides ul li:nth-child(2), .slides ul li:nth-child(2) div {
-webkit-animation-delay: 6.0s;
-moz-animation-delay: 6.0s;
}
.slides ul li:nth-child(3), .slides ul li:nth-child(3) div {
-webkit-animation-delay: 12.0s;
-moz-animation-delay: 12.0s;
}
.slides ul li:nth-child(4), .slides ul li:nth-child(4) div {
-webkit-animation-delay: 18.0s;
-moz-animation-delay: 18.0s;
}
.slides ul li img {
display:block;
}
/* keyframes #anim_titles */
@-webkit-keyframes anim_titles {
0% {
right:100%;
opacity:0;
}
6% {
right:2%;
opacity:1;
}
20% {
right:2%;
opacity:1;
}
26% {
right:100%;
opacity:0;
}
100% {
right:100%;
opacity:0;
}
}
@-moz-keyframes anim_titles {
0% {
right:100%;
opacity:0;
}
6% {
right:1%;
opacity:1;
}
20% {
right:1%;
opacity:1;
}
26% {
right:100%;
opacity:0;
}
100% {
right:100%;
opacity:0;
}
}
.slides ul li div {
background: #8a2e3d; /* Old browsers */
background: -moz-linear-gradient(top, #8a2e3d 0%, #400000 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#8a2e3d), color-stop(100%,#400000)); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top, #8a2e3d 0%,#400000 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top, #8a2e3d 0%,#400000 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top, #8a2e3d 0%,#400000 100%); /* IE10+ */
background: linear-gradient(to bottom, #8a2e3d 0%,#400000 100%); /* W3C */
zoom: 1;
filter: progid:DXImageTransform.Microsoft.gradient(enabled='true', startColorstr=#8a2e3d, endColorstr=#400000, GradientType=0); /*IE*/
-ms-filter: progid:DXImageTransform.Microsoft.gradient(gradientType=0, startColorstr=#8a2e3d, endColorStr=#400000 ); /*IE*/
border-radius:5px;
border: 1px solid #400000;
box-shadow:0 0 3px #FFFFFF inset;
color:#FFF;
font:12px inherit;
font-style:oblique;
text-align: center;
margin:0 auto;
padding:10px;
position:absolute;
top:80%;
width:300px;
/* css3 animation */
-webkit-animation-name: anim_titles;
-webkit-animation-duration: 24.0s;
-webkit-animation-timing-function: linear;
-webkit-animation-iteration-count: infinite;
-webkit-animation-direction: normal;
-webkit-animation-delay: 0;
-webkit-animation-play-state: running;
-webkit-animation-fill-mode: forwards;
-moz-animation-name: anim_titles;
-moz-animation-duration: 24.0s;
-moz-animation-timing-function: linear;
-moz-animation-iteration-count: infinite;
-moz-animation-direction: normal;
-moz-animation-delay: 0;
-moz-animation-play-state: running;
-moz-animation-fill-mode: forwards;
}
|
to je ono sto me ohrabruje. Problem je samo sto sam ja pocetnica i ne snalazim se dobro u znacenjima nekih funkcija i samim tim ne umijem da napisem kod kako treba.
