afm-client/bower_components/tether/examples/out-of-bounds/index.html

   1 <!DOCTYPE html>
   2 <html>
   3     <head>
   4         <meta charset="utf-8">
   5         <meta http-equiv="X-UA-Compatible" content="chrome=1">
   6         <meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no">
   7         <link rel="stylesheet" href="../resources/css/base.css" />
   8         <link rel="stylesheet" href="../common/css/style.css" />
   9         <style>
  10             .tether-element.tether-out-of-bounds {
  11                 display: none;
  12             }
  13         </style>
  14     </head>
  15     <body>
  16         <div class="instructions">Resize the screen to see the tethered element disappear when it can't fit.</div>
  17
  18         <div class="element"></div>
  19         <div class="target"></div>
  20
  21         <script src="../../tether.js"></script>
  22         <script>
  23             new Tether({
  24                 element: '.element',
  25                 target: '.target',
  26                 attachment: 'top left',
  27                 targetAttachment: 'top right',
  28                 constraints: [{
  29                     to: 'window',
  30                     attachment: 'together'
  31                 }]
  32             });
  33         </script>
  34     </body>
  35 </html>