Image embarquée en tant que constante

Bonjour à tous
J'ai un script javascript dans lequel j'affiche une petite image.
Je suis donc obligé de me 'traîner' un fichier png en plus de mon fichier js et je trouve que c’est un peu pénible.
Il me semble que j'ai vu qu'i est possible d'embarquer une image dans une constante (une petite image bien sûr, genre 20x20) dans le script javascript et de pouvoir l'afficher sans avoir de fichier image externe. Impossible de trouver une piste sur le web !

Quelqu'un a-t-il une idée sur cette faisabilité
Merci
YC

encodées en base64 c'est possible pour ensuite le mettre en src d'une balise image ou en faire un draw dans un canvas

Bonjour,

Tu peux la mettre dans le src d'une image de la façon suivante :

Code:

---

<img src="data:image/png;base64,<Ton image en base 64>" />

---

Par exemple :

Code:

---

<img src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAAABGdBTUEAAK/INwWK6QAAAAZiS0dEAP8A/wD/oL2nkwAAAAlwSFlzAAAASAAAAEgARslrPgAAAAl2cEFnAAAAIAAAACAAh/qcnQAABEVJREFUWMPtlv1Pk1cUx++cb/ALcxFNzMKjC8LmNhZ0iyCKA6lQkC5jYCkW+vK0lFLEshJRKq8VKDArFJGX8SYgq0SROReZbsmSmSEDX6bZfnTxIfHX/QObZ/f7DAdmZqHdiL9wk+89zznne+7npk2elrHltbxe9NqQxoK3G0IN+4rfqEk6sq0q6cibS6xtVWCBCTYLTmRhYkPqw9pBK1X0iVQJ9Zv+Up9Jrj0V8vnewrp/M2CBCTYLSmBCcUuW5OjIJItHQebmJNLXJpCOy1ifKNcKuBCRo44+fAVzPX9mUAMLTLBZ0Ae4wEGprFtNNm8KaUqSKM+YQzpRS2qjisyNCjrcppQjctTRh6+I1yF/ZsAAC0yw2Vq+2b1qydmbQ3VDFjp8zEgm0Ux6nZ70xjyq+8xOzh6NHJGjjj588AcyAxaYa+UL7GVCSVu2VDWQS6dHHVR6wkYZGRmkVCop51A2eYer+XdmkCNy1NGHD/5AZsACE2y2hm+OMxrp5DAfuHSUHM5CUigUFBsTSx9nfUTtI7VUf94sR+Soow8f/IHMgAUm2Gw130rbD0mNn5upY7ycm2y0c2cMRUZGUroqjTp9ddTss8oROerowwd/IDNggblavkA8E452aCXPxUJqHs0nc2kmxe/ZSzu2v0dpqmRy9ZrI7TPKETnq6MMHfyAzYIEJNlvFt2OdudKZ8WJqumCg8jYNiQ4VGezpZKvMoPphPTWNGuWIHHX04UMd8muGM8ACc5V8gT1MON6lk7quOqhlzEKtl63kHZ9X61jB33qmfnm+jufFzVhlBlhggs1W8s3ZrZf6JsroeGcmWd0KsjXtp8L/WTgTZ4MBFphgs5d3M6GixygN3XBSAX9riTXRZHK9syTC2WCABSbY8gUqe0XJ9101OVrSyVAVQ/kndy+JcDYYYIEpX2BFHBOq+83SxZsu6v+6lLqv2pdUYIAFJtiM7WKCa8AiTcy00heTbroy2cjlb+S6NZffcs8/P+0tEBhguc5ZpJdwgU0J7PW8yjjJPWSmT0fyyT1o8is2DIrUcE4kV5/4e02/+XFNr/hb/YCJmvibsGn4+WoesRBnPlwfz3+Oo3exiIr6uNnhS/vpxvdZdH5s36LjNzezaOBCPPX7EqmsNvZxUBSLTs7edKKtJ+XJlevpND5x4DlKo6++zaRyV+yj8Cj+CUS9zyLau1Jnb9/T0f2fRZq+o/ErTs2oafpuLnnPpsyGbGQbc8XwomvXdU/uPdDR3ft5/9Cdn/LowS/8fXM2RRIi+QXe3sG2trYfeDQ1Y6Mffsyfk8WvOHW7iE55lVJwCAvPzBFKvryW/8fktGXBec8Kfk9b6q9hEfwCm7eydcoPN9jVWsFzUCucCkRq7WZPcnroJ0HBbMtb766Jy8gOq1X/q1/wpKhC7a9tYa/gf+lKrhCudf9Rr3KFcq1fpD9kji2vFS9Iy2t5sT8BSc3ECPy9NcgAAAAldEVYdGRhdGU6Y3JlYXRlADIwMDktMDktMTVUMTA6MzE6NTArMDI6MDBlG1b1AAAAJXRFWHRkYXRlOm1vZGlmeQAyMDA5LTA5LTE1VDEwOjMxOjUwKzAyOjAwFEbuSQAAABl0RVh0U29mdHdhcmUAQWRvYmUgSW1hZ2VSZWFkeXHJZTwAAAAASUVORK5CYII="/>

---

Merci pour ta réponse.

Existe-t-il un outil qui pourrait me permettre d'obtenir cette liste de caractères représentant l'image png.
J'ai cherché sur le web mais ce que j'ai trouvé me donne la valeur hexa de chaque octet.
Je ne me vois pas convertir tout ça à la main !!!:(

Le web n'est pas très prolixe sur le sujet ....

Je n'ai pas testé, mais en PHP tu devrais pouvoir utiliser :

Code:

---

print base64_encode(file_get_contents("/path/de/ton/image"));

---

Après une recherche rapide sur google : http://www.motobit.com/util/base64-decoder-encoder.asp

Merci, je vais regarder ça de plus près.
Je dirais ici le résultat

Il y a plein de freewaree ou des sites qui font ça online ...

Merci à tous, ça marche nickel .....

Ce petit utilitaire inline est très pratique http://www.motobit.com/util/base64-decoder-encoder.asp (merci jzyra)
Ça marche même avec des gifs animés

Merci
YC