From 90902db50cd9545639bb79ae30d1d81e84c12b6c Mon Sep 17 00:00:00 2001 From: Julian Thilo Date: Fri, 28 Mar 2014 12:48:19 +0100 Subject: Fix tooltip viewport example - Move example to correct location docs/examples/ - Move custom JS and CSS into stand-alone files - Update headers and footers - Copy-editing --- docs/examples/tooltip-viewport/index.html | 56 ++++++++++++++++++++++ .../examples/tooltip-viewport/tooltip-viewport.css | 28 +++++++++++ docs/examples/tooltip-viewport/tooltip-viewport.js | 18 +++++++ 3 files changed, 102 insertions(+) create mode 100644 docs/examples/tooltip-viewport/index.html create mode 100644 docs/examples/tooltip-viewport/tooltip-viewport.css create mode 100644 docs/examples/tooltip-viewport/tooltip-viewport.js (limited to 'docs/examples') diff --git a/docs/examples/tooltip-viewport/index.html b/docs/examples/tooltip-viewport/index.html new file mode 100644 index 000000000..2f6d0dd38 --- /dev/null +++ b/docs/examples/tooltip-viewport/index.html @@ -0,0 +1,56 @@ + + + + + + + + + + + Tooltip Viewport Example for Bootstrap + + + + + + + + + + + + + + + + + + + + +
There is a button down there ↓
+ + + +
+ + + + + + +
+ + + + + + + + + diff --git a/docs/examples/tooltip-viewport/tooltip-viewport.css b/docs/examples/tooltip-viewport/tooltip-viewport.css new file mode 100644 index 000000000..2d82e9b42 --- /dev/null +++ b/docs/examples/tooltip-viewport/tooltip-viewport.css @@ -0,0 +1,28 @@ +body { + height: 1200px; +} +.tooltip { + min-width: 250px; + max-width: 500px; +} +.tooltip .tooltip-inner { + min-height: 200px; + min-width: 250px; + max-width: 500px; +} +.placeholder { + height: 900px; +} +.container-viewport { + position: absolute; + left: 200px; + top: 600px; + width: 600px; + height: 400px; + background: #c00; +} +.btn-bottom { + position: absolute; + left: 0; + bottom: 0; +} diff --git a/docs/examples/tooltip-viewport/tooltip-viewport.js b/docs/examples/tooltip-viewport/tooltip-viewport.js new file mode 100644 index 000000000..e87f4eec7 --- /dev/null +++ b/docs/examples/tooltip-viewport/tooltip-viewport.js @@ -0,0 +1,18 @@ +$(document).ready(function () { + $('.tooltip-right').tooltip({ + placement: 'right', + viewport: {selector: 'body', padding: 2} + }) + $('.tooltip-bottom').tooltip({ + placement: 'bottom', + viewport: {selector: 'body', padding: 2} + }) + $('.tooltip-viewport-right').tooltip({ + placement: 'right', + viewport: {selector: '.container-viewport', padding: 2} + }) + $('.tooltip-viewport-bottom').tooltip({ + placement: 'bottom', + viewport: {selector: '.container-viewport', padding: 2} + }) +}) -- cgit v1.2.3