Vertical Slider loading order problem

[jo3k4r]

I’ve got a loading problem on my homepage…the first slide need to load at first but some background image are loading randomly…Is there a solution to load the first slide image at the begining ?

[Foster]

Hi,

What’s the first slide and the first image on your site?

[jo3k4r]

when the homapage is totally loaded…the the first slide…the one with the texte and a background

[jo3k4r]

.vc_custom_1504969572587 {
background-image: url(https://www.kqk.ca/wp-content/uploads/parallax_accueil_fw17-18_look7-4.jpg?id=5752) !important;
background-position: center !important;
background-repeat: no-repeat !important;
background-size: cover !important;
}

[jo3k4r]

.badge{display:none;}
h4, h3{display:none;}

i put that to try to just don’t display these element till this image is not loaded. It’s my only idea

[jo3k4r]

i put that in the js part of the theme option to know when my image is load and i’m gonna change the property “display” of my hidden elements 🙂

var img = new Image();
img.onload = function() { alert(“Height: ” + this.height); }
img.src = “https://www.kqk.ca/wp-content/uploads/parallax_accueil_fw17-18_look7-4.jpg”;

[jo3k4r]

i get it with this code:

var img = new Image();
img.onload = function() {
var x = document.getElementsByTagName(“h3”);
var y = document.getElementsByTagName(“h4”);
var z = document.getElementsByClassName(“visualHack”);
for (i = 0; i < x.length; i++) {
x.style.display= “block”;
}
for (j = 0; j < y.length; j++) {
y[j].style.display= “block”;
}
for (k = 0; k < z.length; k++) {
z[k].style.display= “block”;
}
}
img.src = “https://www.kqk.ca/wp-content/uploads/parallax_accueil_fw17-18_look7-4.jpg&#8221;;

[Harry]

Hi,

Sorry for late reply.

This mean you solved your issue?

Harry
Premium Wordpress themes and plugins, Best WooCommerce theme https://themeforest.net/user/janstudio/portfolio?ref=janstudio

[Author]

Posts