Create gradient background that will change different values over time. We can multiple use CSS property values. Just ensure that you use same amount of values in every style value properties e.g.:
Valid value pairs: #fff 10px and #000 20px
Invalid value pairs: #fff 10px 10px and 10px 10px
var stimed = new $.stimed({
timeTarget: '.time',
speedUp: 1000
});
stimed.style.create([{
target: 'main',
time: '0',
property: 'background',
value: 'linear-gradient(0deg, #003e6a 0%, #011f3d 100%)'
}, {
target: 'main',
time: '06:00',
property: 'background',
value: 'linear-gradient(180deg, #46A8F9 0%, #0C9AC9 100%)'
}, {
target: 'main',
time: '12:00',
property: 'background',
value: 'linear-gradient(180deg, #f4d5a8 0%, #65b0db 100%)'
}, {
target: 'main',
time: '18:00',
property: 'background',
value: 'linear-gradient(180deg, #0f7af0 0%, #003e6a 100%)'
}, {
target: 'main',
time: '24:00',
property: 'background',
value: 'linear-gradient(360deg, #003e6a 0%, #011f3d 100%)'
}]);