Slideshow filter effects
Grayscale
animated
Hue rotate
animated
Sepia
animated
Brightness
animated
Contrast
animated
Saturate
animated
Opacity
animated
Invert
Slideshow transition
Display time
















Safari alert
If you use max browser size before you start fullscreen mode, there's a unsolved safari
problem.
Therefore real fullscreen mode is canceled.
Please resize your browser window and use not maxi size then try it again.
Therefore real fullscreen mode is canceled.
Please resize your browser window and use not maxi size then try it again.
|
|
|
.myFilters {
filter:x;
-webkit-filter:x;
}
.filterAnimated {
animation-duration: x.duration;
animation-name: x.name;
animation-iteration-count: x.iteration_count;
animation-direction: x.direction;
}
@keyframes filterxReplaceNamexAnimation {
from {
filter: xReplaceFilterx(xReplaceFromx);
-webkit-filter: xReplaceFilterx(xReplaceFromx);
}
xReplacePercentsx
to {
filter: xReplaceFilterx(yReplaceToy);
-webkit-filter: xReplaceFilterx(yReplaceToy);
}
}
@keyframes filterxReplaceNamexAnimation {
from {
filter: xReplaceFilterFromx;
-webkit-filter: xReplaceFilterFromx;
}
xReplacePercentsx
to {
filter: xReplaceFilterTox;
-webkit-filter: xReplaceFilterTox;
}
}
xReplacePercentx% {
filter: xReplaceFilterx(xReplaceValuex);
-webkit-filter: xReplaceFilterx(xReplaceValuex);
}
xReplacePercentx% {
filter: xReplaceFiltersValuesx;
-webkit-filter: xReplaceFiltersValuesx;
}
.myclass {
animation: myanimation Xs;
}
.bgcolor {
background: X;
}