tengo un slideshow el caso es que las imágenes son muy brillantes y lo que necesito es que cuando cargue una imagen a los segundos, justo antes que aparezca el texto se coloque un fondo encima de la imagen como un background
, lo hice pero quiero hacerlo en segundos intente con animate
de jquery
, y transition
de css
pero no logro hacerlo acá les mando el código
if(g.hasClass("slider_thumbs")){ // Esta haciendo el cambio de imagen
var k=$j("div.item").index($j("div.item.active")[0])+1 // Para saber cuando cambia de imagen en el slider
$j("div.item.active").addClass("element_hovered");
}
<div id="image_1" class="image" style="
background-image:
linear-gradient(
rgba(0, 0, 0, 0.3),
rgba(253, 249, 249, 0.3)
),
url(img/widget3/Widget-3.jpg); background- size:cover">
</div>
El código javascript
digamos que es el código que utiliza apenas cambie de imagen, por lo que ahí podría hacer la modificación el tema es que el div
esta perfecto porque tiene un fondo negro y se aprecia las letras, pero lo que necesito es que ese fondo se coloque en segundos, no al instante, es decir quiero que el Linear-gradient funcione a los segundos de haber cargado dicha imagen