[ Index ]

PHP Cross Reference of Drupal 6 (yi-drupal)

title

Body

[close]

/sites/all/libraries/highslide/examples/ -> gallery-dark.html (source)

   1  <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "xhtml11.dtd">
   2  <html>
   3  <head>
   4  <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
   5  
   6  <title>Highslide JS</title>
   7  
   8  <!--
   9      1 ) Reference to the files containing the JavaScript and CSS.
  10      These files must be located on your server.
  11  -->
  12  
  13  <script type="text/javascript" src="../highslide/highslide-with-gallery.js"></script>
  14  <link rel="stylesheet" type="text/css" href="../highslide/highslide.css" />
  15  
  16  <!--
  17      2) Optionally override the settings defined at the top
  18      of the highslide.js file. The parameter hs.graphicsDir is important!
  19  -->
  20  
  21  <script type="text/javascript">
  22  hs.graphicsDir = '../highslide/graphics/';
  23  hs.align = 'center';
  24  hs.transitions = ['expand', 'crossfade'];
  25  hs.outlineType = 'glossy-dark';
  26  hs.wrapperClassName = 'dark';
  27  hs.fadeInOut = true;
  28  //hs.dimmingOpacity = 0.75;
  29  
  30  // Add the controlbar
  31  if (hs.addSlideshow) hs.addSlideshow({
  32      //slideshowGroup: 'group1',
  33      interval: 5000,
  34      repeat: false,
  35      useControls: true,
  36      fixedControls: 'fit',
  37      overlayOptions: {
  38          opacity: .6,
  39          position: 'bottom center',
  40          hideOnMouseOut: true
  41      }
  42  });
  43  
  44  </script>
  45  
  46  
  47  </head>
  48  
  49  <body>
  50  
  51  <!--
  52      3) Put the thumbnails inside a div for styling
  53  -->
  54  <div class="highslide-gallery">
  55  
  56  <!--
  57      4) This is how you mark up the thumbnail image with an anchor tag around it.
  58      The anchor's href attribute defines the URL of the full-size image.
  59  -->
  60  <a href="../images/gallery1.jpg" class="highslide" onclick="return hs.expand(this)">
  61      <img src="../images/gallery1.thumb.jpg" alt="Highslide JS"
  62          title="Click to enlarge" />
  63  </a>
  64  
  65  <!--
  66      5 (optional). This is how you mark up the caption. The correct class name is important.
  67  -->
  68  
  69  <div class="highslide-caption">
  70      Caption for the first image. This caption can be styled using CSS.
  71  </div>
  72  
  73  
  74  <!-- Repetionion of the above -->
  75  <a href="../images/gallery2.jpg" class="highslide" onclick="return hs.expand(this)">
  76      <img src="../images/gallery2.thumb.jpg" alt="Highslide JS"
  77          title="Click to enlarge" /></a>
  78  
  79  <div class="highslide-caption">
  80      Caption for the second image.
  81  </div>
  82  
  83  <a href="../images/gallery3.jpg" class="highslide" onclick="return hs.expand(this)">
  84      <img src="../images/gallery3.thumb.jpg" alt="Highslide JS"
  85          title="Click to enlarge" /></a>
  86  
  87  <div class="highslide-caption">
  88      Caption for the third image.
  89  </div>
  90  
  91  </div>
  92  </body>
  93  </html>


Generated: Mon Jul 9 18:01:44 2012 Cross-referenced by PHPXref 0.7