Magic Thumb™

Examples

Global options

Buy now  £25 Get support

Set your parameters in the <script> tag to apply the same options to all images with the MagicThumb class.

Here's the code:

  1. <html>
  2.     <head>
  3.         <title>Global options</title>
  4.        
  5.         <!-- link to magicthumb.css file -->
  6.         <link href="magicthumb/magicthumb.css" rel="stylesheet" type="text/css" media="screen"/>
  7.         <!-- link to magicthumb.js file -->
  8.         <script src="magicthumb/magicthumb.js" type="text/javascript"></script>
  9.         <script type="text/javascript">
  10.             MagicThumb.options = {
  11.                 'background-opacity': 70,
  12.                 'background-color': '#00ccf0',
  13.                 'buttons-display': 'close'
  14.             };
  15.         </script>        
  16.        
  17.     </head>
  18.     <body>
  19.        
  20.         <h4>Set your parameters in the &lt;script&gt; tag to apply the same options to all images with the MagicThumb class.</h4>
  21.         <!-- define Magic Thumb -->
  22.         <a href="images/imac-family-600.jpg" class="MagicThumb"><img src="images/imac-family-90.jpg" alt=""/></a>
  23.        
  24.     </body>
  25. </html>