5 <meta name=
"viewport" content=
"width=device-width, initial-scale=1, shrink-to-fit=no">
6 <meta name=
"description" content=
"">
7 <meta name=
"author" content=
"">
8 <link rel=
"shortcut icon" href=
"../../favicon.ico">
10 <title>Tooltip Viewport Example for Bootstrap
</title>
12 <!-- Bootstrap core CSS -->
13 <link href=
"../../dist/css/bootstrap.min.css" rel=
"stylesheet">
15 <!-- Custom styles for this template -->
16 <link href=
"tooltip-viewport.css" rel=
"stylesheet">
21 <button class=
"btn btn-secondary float-right tooltip-bottom" title=
"This should be shifted to the left">Shift Left
</button>
22 <button class=
"btn btn-secondary tooltip-bottom" title=
"This should be shifted to the right">Shift Right
</button>
23 <button class=
"btn btn-secondary tooltip-right" title=
"This should be shifted down">Shift Down
</button>
25 <button class=
"btn btn-secondary tooltip-right btn-bottom" title=
"This should be shifted up">Shift Up
</button>
27 <div class=
"container-viewport">
28 <button class=
"btn btn-secondary tooltip-viewport-bottom" title=
"This should be shifted to the left">Shift Left
</button>
29 <button class=
"btn btn-secondary tooltip-viewport-right" title=
"This should be shifted down">Shift Down
</button>
31 <button class=
"btn btn-secondary float-right tooltip-viewport-bottom" title=
"This should be shifted to the right">Shift Right
</button>
33 <button class=
"btn btn-secondary tooltip-viewport-right btn-bottom" title=
"This should be shifted up">Shift Up
</button>
37 <!-- Bootstrap core JavaScript
38 ================================================== -->
39 <!-- Placed at the end of the document so the pages load faster -->
40 <script src=
"https://code.jquery.com/jquery-3.1.1.slim.min.js" integrity=
"sha384-A7FZj7v+d/sdmMqp/nOQwliLvUsJfDHW+k9Omg/a/EheAdgtzNs3hpfag6Ed950n" crossorigin=
"anonymous"></script>
41 <script>window.jQuery || document.write('
<script src=
"../../assets/js/vendor/jquery.min.js"><\/script
>')
</script>
42 <script src=
"https://cdnjs.cloudflare.com/ajax/libs/tether/1.4.0/js/tether.min.js" integrity=
"sha384-DztdAPBWPRXSA/3eYEEUWrWCy7G5KFbe8fFjk5JAIxUYHKkDx6Qin1DkWx51bBrb" crossorigin=
"anonymous"></script>
43 <script src=
"../../dist/js/bootstrap.min.js"></script>
44 <script src=
"../../assets/js/vendor/tether.min.js"></script>
45 <!-- IE10 viewport hack for Surface/desktop Windows 8 bug -->
46 <script src=
"../../assets/js/ie10-viewport-bug-workaround.js"></script>
47 <script src=
"tooltip-viewport.js"></script>