Partage

Faire charger ses images plus rapidement

16 avril 2018 à 9:55:25

Bonjour à tous et à toutes !

J'ai un petit problème avec mon projet.

Dans mes pages j'utilise des checkboxs d'images. La première image charge parfaitement mais quand je charge la deuxième, j'ai un petit temps de chargement d'image (environ 1/3 de seconde) j'aimerais régler ce problème gênant... Suis je obligé d'utiliser ajax ?

Voici la retranscription du bug sur codepen.io : https://codepen.io/Eter49/pen/dmBOOP

(même si dans mon cas les images que j'utilise sont dans un fichier images et non hébergées)

(Merci Syltaen d'avoir trouvé mon problème)

-
Edité par Petitpainaumiel 16 avril 2018 à 10:03:27

Staff 16 avril 2018 à 10:02:00

Bonjour,

"checkboxs d'images", c'est-à-dire ? Que cherches-tu à faire exactement ?

À noter que ton code n'est pas censé fonctionner : lire https://developer.mozilla.org/en-US/docs/Web/CSS/content. "content" ne s'applique qu'aux pseudo-éléments ::before et ::after.

Pas d'aide concernant le code par MP ni par mail, le forum est là pour ça :) Postez votre code html et css (bouton '</>') !!
16 avril 2018 à 10:05:47

Je cherche à avoir un bouton cliquable qui fait défiler des images... j'ai préféré utiliser que du css /html pour faire ca n’étant pas à l'aise avec Js.
Staff 16 avril 2018 à 10:53:17

Je vois. Je pense que tu te compliques très fortement la tâche, en te donnant cette contrainte… et je t'invite à chercher plutôt à apprendre un tout petit peu de JavaScript, juste pour pouvoir faire ce slider. Dans tous les cas, de base, ça ne peut pas fonctionner, puisque les checkboxes ne peuvent pas avoir de "content". Sur quel navigateur testes-tu, qui te permette de faire ça ?
Pas d'aide concernant le code par MP ni par mail, le forum est là pour ça :) Postez votre code html et css (bouton '</>') !!
16 avril 2018 à 11:13:41

Sur Chrome ca marche très bien en revanche sur les autres navigateurs ca ne marche pas en effet :S

Je vais essayer avec Js mais je pense que le problème sera le même...

La seconde image mets un peu + de temps a charger au clic et ce petit temps entre les 2 mets la 2eme image à une hauteur 0 ce qui crée un petit bug... 

16 avril 2018 à 13:33:34

Salut,

comme expliqué dans l'autre topic, tu dois pré-charger tes images pour qu'elles soient "prêtes" au moment où tu veux les utiliser.
Par exemple : https://codepen.io/anon/pen/XEvRqo

Mais effectivement, tu devrais te tourner vers JavaScript pour faire défiler tes images.

Faire charger ses images plus rapidement

× Après avoir cliqué sur "Répondre" vous serez invité à vous connecter pour que votre message soit publié.
× Attention, ce sujet est très ancien. Le déterrer n'est pas forcément approprié. Nous te conseillons de créer un nouveau sujet pour poser ta question.
  • Editeur
  • Markdown