Browse files

Removing old positionable demo file

  • Loading branch information...
1 parent cd2f476 commit 06caef2718c6fdeec5f86643c2dbbf5c73fdf5de @daffl daffl committed Sep 18, 2012
Showing with 0 additions and 123 deletions.
  1. +0 −123 positionable/demos.html
View
123 positionable/demos.html
@@ -1,123 +0,0 @@
-<!doctype html>
-<html lang="en">
- <head>
- <title>jQuery UI Position - Default functionality</title>
-
-
- <style type="text/css">
- body {
- font-family: Arial, sans-serif;
- }
- .tooltip {
- width: 200px;
- height: 20px;
- line-height: 20px;
- text-align: center;
- background: rgba(0,0,0,0.7);
- color: white;
- font-size: 12px;
- font-weight: bold;
- position: relative;
- display: none;
- }
- .triangle {
- width: 0px;
- height: 0px;
- border-style: solid;
- border-width: 5px 5px 0 5px;
- border-color: rgba(0,0,0,0.7) transparent transparent transparent;
- position: absolute;
- bottom: 0;
- margin-bottom: -5px;
- left: 50%;
- margin-left: -5px;
- }
- .body {
- margin-top: 50px;
- }
- .scrollable {
- height: 150px;
- border: 1px solid black;
- overflow: auto;
- position: relative;
- width: 300px;
- }
- .scrollable table{
- width: 800px;
- }
- .scrollable table td {
- padding-left: 100px;
- }
- </style>
- </head>
- <body>
- <div class="tooltip"><span></span><div class="triangle"></div></div>
- <div class="body">
- Lorem ipsum dolor sit amet, <a href="#" data-tooltip="Tooltip: consectetur">consectetur</a> adipiscing elit. Pellentesque justo felis, congue non placerat non, egestas id sapien. Donec placerat luctus cursus. Sed id urna at nibh cursus pulvinar vitae feugiat turpis. Donec massa tellus, molestie sit amet hendrerit id, semper at nisi. Proin elementum, metus vel pretium vehicula, metus libero gravida ante, a pulvinar sem lorem ut ipsum. Nullam lorem libero, mollis non feugiat id, consequat id ligula. In laoreet porttitor enim, vehicula feugiat libero hendrerit vel. <a href="#" data-tooltip="Tooltip: Mauris">Mauris</a> velit dui, tempus ac dapibus in, tincidunt at dui. Suspendisse ante lectus, egestas vel scelerisque vitae, cursus et mauris. Phasellus viverra accumsan enim, et ullamcorper odio adipiscing a. Aliquam in mi sed nibh elementum interdum eu in tellus.
- </div>
- <div class="scrollable">
- <table>
- <tr><td><a href="#" data-tooltip="Row tooltip 1 ">Show tooltip 1 </a></td></tr>
- <tr><td><a href="#" data-tooltip="Row tooltip 2 ">Show tooltip 2 </a></td></tr>
- <tr><td><a href="#" data-tooltip="Row tooltip 3 ">Show tooltip 3 </a></td></tr>
- <tr><td><a href="#" data-tooltip="Row tooltip 4 ">Show tooltip 4 </a></td></tr>
- <tr><td><a href="#" data-tooltip="Row tooltip 5 ">Show tooltip 5 </a></td></tr>
- <tr><td><a href="#" data-tooltip="Row tooltip 6 ">Show tooltip 6 </a></td></tr>
- <tr><td><a href="#" data-tooltip="Row tooltip 7 ">Show tooltip 7 </a></td></tr>
- <tr><td><a href="#" data-tooltip="Row tooltip 8 ">Show tooltip 8 </a></td></tr>
- <tr><td><a href="#" data-tooltip="Row tooltip 9 ">Show tooltip 9 </a></td></tr>
- <tr><td><a href="#" data-tooltip="Row tooltip 10">Show tooltip 10</a></td></tr>
- <tr><td><a href="#" data-tooltip="Row tooltip 11">Show tooltip 11</a></td></tr>
- <tr><td><a href="#" data-tooltip="Row tooltip 12">Show tooltip 12</a></td></tr>
- <tr><td><a href="#" data-tooltip="Row tooltip 13">Show tooltip 13</a></td></tr>
- <tr><td><a href="#" data-tooltip="Row tooltip 14">Show tooltip 14</a></td></tr>
- <tr><td><a href="#" data-tooltip="Row tooltip 15">Show tooltip 15</a></td></tr>
- <tr><td><a href="#" data-tooltip="Row tooltip 16">Show tooltip 16</a></td></tr>
- <tr><td><a href="#" data-tooltip="Row tooltip 17">Show tooltip 17</a></td></tr>
- <tr><td><a href="#" data-tooltip="Row tooltip 18">Show tooltip 18</a></td></tr>
- <tr><td><a href="#" data-tooltip="Row tooltip 19">Show tooltip 19</a></td></tr>
- <tr><td><a href="#" data-tooltip="Row tooltip 20">Show tooltip 20</a></td></tr>
- <tr><td><a href="#" data-tooltip="Row tooltip 21">Show tooltip 21</a></td></tr>
- <tr><td><a href="#" data-tooltip="Row tooltip 22">Show tooltip 22</a></td></tr>
- <tr><td><a href="#" data-tooltip="Row tooltip 23">Show tooltip 23</a></td></tr>
- <tr><td><a href="#" data-tooltip="Row tooltip 24">Show tooltip 24</a></td></tr>
- <tr><td><a href="#" data-tooltip="Row tooltip 25">Show tooltip 25</a></td></tr>
- <tr><td><a href="#" data-tooltip="Row tooltip 26">Show tooltip 26</a></td></tr>
- <tr><td><a href="#" data-tooltip="Row tooltip 27">Show tooltip 27</a></td></tr>
- <tr><td><a href="#" data-tooltip="Row tooltip 28">Show tooltip 28</a></td></tr>
- <tr><td><a href="#" data-tooltip="Row tooltip 29">Show tooltip 29</a></td></tr>
- </table>
- </div>
- <script type='text/javascript'
- src='../../steal/steal.js'
- package='main.js'
- compress='false'>
- </script>
- <script type='text/javascript'>
-
- steal(
- "canui/positionable"
- ).then(function() {
-
- $('a').click(function(){
- var tooltip = $('.tooltip').show();
- tooltip.find('span').html($(this).data('tooltip'));
- tooltip.positionable({
- of: $(this),
- my: "bottom",
- at: "top",
- hideWhenInvisible: true
- });
- tooltip.trigger('move')
- return false;
- })
- $('.scrollable').bind('scroll', function(){
- $('.tooltip').trigger('move')
- })
- })
-
- </script>
-</body>
-</html>
-
-

0 comments on commit 06caef2

Please sign in to comment.