Estoy teniendo varios inconvenientes mostrando imagenes y slider en mi html. Al cargar la pagina desde el arranque las imagenes tardan demasiado en mostrarse, y se van cargando poco a poca y se muestra la imagen cargando, se ve muy feo obviamente. aca les muestro una foto
las imagenes son png y pesan entre 4 a 7 mb cada una, queria tener un asesoramiento del pq podria tener ese comportamiento?
y segundo, tengo un slider que hice con lightslider de jquery, funciona muy bien, pero al cargar la pagina desde el arranque, el lightslider sale por defecto en vertical, hasta que se acomoda en horizontal donde lo ubico en mi web. Pero al arrancar la pagina se muestra de manera vertical hasta que se acomoda en horizontal, pero de manera muy lenta. lo tengo con $(document ) ready. Tendira que retrasarlo para que solo se muestre cuando este listo? O ajuro tendria que ponerle un loader a mi pagina hasta que este todo listo para mostrarse? asi se ve en slider
este es el html del slider
<!-- --------- 1--------->
<li class="item-a">
<!-- slider box -->
<div class="boxmarve">
<!-- model -->
<img src="estilos/imagenes/tecno/point.png" class="model">
<!-- details -->
<div class="details">
</div>
</div>
</li>
</ul>
tiene varios item-a que forman el slider obviamente
y este el es js del slider
$(document).ready(function() {
var autoplaySlider = $('#autoplay').lightSlider({
auto:true,
loop:true,
pauseOnHover: true,
onSliderLoad: function() {
$('#autoplay').removeClass('cS-hidden');
}
});
$('#total').text(autoplaySlider.getTotalSlideCount());
});
les agradeceria un consejo de como puedo mejorar este rendimiento. Este comportamiento desde el lcoalhost con xampp, y con live server VS.
me pasa lo mismo con la todas las imagenes.