Outils du site

L'intelligence,c'est comme un parachute, quand on n'en a pas on s'écrase. [Coluche]

56-tools:images

Différences

Ci-dessous, les différences entre deux révisions de la page.

Lien vers cette vue comparative

Les deux révisions précédentesRévision précédente
Prochaine révision
Révision précédente
56-tools:images [2017/01/11 09:31] Roge56-tools:images [2017/10/06 23:38] (Version actuelle) – modification externe 127.0.0.1
Ligne 6: Ligne 6:
 Il est très performant de stocker des petites images utilisées fréquement dans la feuille de style. Il est très performant de stocker des petites images utilisées fréquement dans la feuille de style.
  
 +<code css>
 +.ImgCollapsed {
 + width:20; height:20;
 + text-decoration: none; 
 + content: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABUAAAAQCAYAAAD52jQlAAAABGdBTUEAALGPC/xhBQAAAAlwSFlzAAAOwQAADsEBuJFr7QAAABh0RVh0U29mdHdhcmUAcGFpbnQubmV0IDQuMC42/Ixj3wAAAOlJREFUOE+tkCESwjAQRVcgEIhKRAUSgewhEByCQyCQOI7AETgCAoFAcgQEEoFAIBCI8FOS7k8mQzIDnXnT37y/O23FGPN3NIjULGJyntEgsgJbloz3oEp5RsNnyIYLaLhU4hkNOmR5gWVQzHhGQ/gmfngPhiWeSS219xm4uecrmIKvPruUzg7uzHJ099bjqgH7Nei1jhaklu7cmSVeWgH2+aW4/L+7g/jzGxB4v6ed7YIOncCT8qjEM6mlnk1QTHjQ507X7YLIwpUfYM6lEs9oQBGcwYQLpZ7RIDJmEWM9GKRcTPLwN4y8AfxNottsD8mSAAAAAElFTkSuQmCC");
 +}
 +</code>
  
 +usage en HTML:
  
-usage en javascript :+<code html> 
 +<a href="#" onClick="alert('coucou');" title="Open"> <IMG CLASS="Collapsed"/> </a> 
 +</code>
  
-''%%window.ImgCollapsed = "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABwAAAALCAYAAABs3u23AAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAAYdEVYdFNvZnR3YXJlAHBhaW50Lm5ldCA0LjAuNvyMY98AAACtSURBVDhPY/j//z9dMZjYcOjK/9rZO3BikDyyJkowmAAZig9A5TE0k4PBBMjAP3/+wDEDUBjG/vb1A20s/PbtKxyDLATRHz+8/P/gwT0aWQj0CcgidHz31kWcFhobG/8HYWL5IAwmQAZ+/PgWjN++eQa26OXLx2Df3bx6mjYWvnh2A2w4CIMsvHbh2P9LZ/b/P3NyF22CFGTw/r0b/h/asRwDU91CuudD+uH/DADncY0ihCIzIAAAAABJRU5ErkJggg==";%%''+[[http://jsfiddle.net/redg35ha/|Exemple fiddle]] 
 + 
 +On peut aussi stocker une image dans le javascript : 
 +<code:js> 
 +window.ImgCollapsed = "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABwAAAALCAYAAABs3u23AAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAAYdEVYdFNvZnR3YXJlAHBhaW50Lm5ldCA0LjAuNvyMY98AAACtSURBVDhPY/j//z9dMZjYcOjK/9rZO3BikDyyJkowmAAZig9A5TE0k4PBBMjAP3/+wDEDUBjG/vb1A20s/PbtKxyDLATRHz+8/P/gwT0aWQj0CcgidHz31kWcFhobG/8HYWL5IAwmQAZ+/PgWjN++eQa26OXLx2Df3bx6mjYWvnh2A2w4CIMsvHbh2P9LZ/b/P3NyF22CFGTw/r0b/h/asRwDU91CuudD+uH/DADncY0ihCIzIAAAAABJRU5ErkJggg==";'' 
 +</code>
Dernière modification : 2017/10/06 23:38