<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:dojo="http://www.dojotoolkit.org/2004/dojoml" xmlns:xlink="http://www.w3.org/1999/xlink" xml:lang="en" lang="en">
<head>
<title>placeOnScreen & placeOnScreenPoint</title>
<script type="text/javascript">
// Dojo configuration
djConfig = {
isDebug: true
};
</script>
<script type="text/javascript" src="../dojo.js"></script>
<script type="text/javascript">
dojo.require("dojo.html.util");
dojo.require("dojo.event.*");
function init() {
dojo.event.connect(document, "onclick", function(e) {
dojo.html.placeOnScreen("test", e.clientX, e.clientY, 5, false, ['TL', 'TR', 'BL', 'BR']);
dojo.html.placeOnScreen("test2", e.clientX, e.clientY, 0, false);
});
}
dojo.addOnLoad(init);
</script>
<style type="text/css">
html, body {
font-family : sans-serif;
cursor : crosshair;
}
#lipsum {
color : #ddd;
}
#test, #test2 {
position : absolute;
width : 200px;
height : 135px;
border : 1px solid;
color : blue;
font-weight : bold;
}
#test2 {
color : red;
}
</style>
</head>
<body>
<div id="test">
placeOnScreenPoint
</div>
<div id="test2">
placeOnScreen
</div>
<div id="lipsum">
<h1>Demo of <code>keepOnScreen</code> and <code>keepOnScreenPoint</code></h1>
<p>
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Nunc
lobortis nulla vel ante molestie facilisis. Fusce nec mauris. Integer
in velit. Suspendisse tellus. Nulla fermentum. Aliquam sapien erat,
vulputate vel, imperdiet eu, fringilla id, dui. Fusce in elit. Duis
condimentum tellus nec sem. Mauris hendrerit. Ut tortor lacus, volutpat
eu, auctor sed, porta eu, ipsum. Fusce ornare, diam blandit fermentum
imperdiet, nunc est posuere lacus, eget dignissim lacus velit porta mi.
Nullam sed tellus a est volutpat mattis. Nulla cursus erat ut enim.
Fusce nisi est, tempus id, facilisis eu, auctor a, quam. In feugiat
venenatis orci. Praesent sed est. Mauris sapien metus, consequat eu,
tincidunt eu, dapibus ut, massa. Nam nunc. Sed suscipit, diam non
commodo pretium, felis augue sollicitudin quam, ut gravida urna urna
nec sapien.
</p>
<p>Nunc eget purus. Vivamus pellentesque erat id massa. Ut nisi. Fusce
tincidunt nulla vel neque. Nulla facilisi. Maecenas molestie. Morbi
erat massa, pellentesque sit amet, mollis nec, sagittis nec, turpis.
Etiam non felis. Donec diam dui, posuere eget, pulvinar in, vestibulum
cursus, nulla. Aenean fringilla diam. In accumsan fringilla metus.
Pellentesque porta, mauris sed dictum blandit, orci augue fringilla
ante, sed sodales dui erat nec lacus. Vivamus felis elit, hendrerit
vel, dapibus vitae, euismod eget, velit.
</p>
<p>Nullam vitae justo placerat nunc elementum tempus. Suspendisse
molestie ligula nec pede. Mauris in nisi sit amet lectus ultrices
adipiscing. Mauris ante eros, lacinia sed, aliquam a, laoreet vel,
pede. Etiam sed nisl. Proin risus turpis, consectetuer sit amet, porta
et, laoreet at, nulla. Lorem ipsum dolor sit amet, consectetuer
adipiscing elit. Quisque placerat, lectus vitae consequat tempus,
ligula nunc tincidunt est, nec aliquam metus quam et sem. Vivamus
eleifend, tortor vel ultricies porta, urna sem interdum lectus, et
fermentum pede erat quis lacus. Phasellus volutpat, diam sit amet
volutpat sodales, felis diam volutpat mi, ac viverra nibh nibh ac
metus. Suspendisse potenti. Phasellus nisl magna, lacinia non, pretium
quis, dictum eget, risus. Sed rutrum. Phasellus at ipsum. Pellentesque
lacus lorem, porttitor eu, hendrerit eu, sodales id, lacus. Nunc nibh.
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Nunc
porttitor.
</p>
<p>Etiam viverra pede in elit. Nunc accumsan fermentum arcu. In aliquet
nisl ac mauris. Nunc dolor. Etiam dapibus vestibulum lectus. Nulla quis
est nec lorem imperdiet porttitor. Morbi a ligula vitae leo feugiat
elementum. Vivamus augue sem, egestas nec, ultricies vitae,
consectetuer non, metus. Vestibulum ante ipsum primis in faucibus orci
luctus et ultrices posuere cubilia Curae; Quisque risus diam, ultricies
at, tempus ac, rutrum ac, nisl. Quisque non augue. Nullam a diam sit
amet magna volutpat porttitor. Donec convallis elit at tortor. Etiam
vulputate, libero sed placerat tincidunt, arcu erat auctor lacus, ac
adipiscing quam nibh eu quam. Fusce commodo pede eu velit. Aenean sit
amet nunc. Phasellus justo dui, congue in, pretium a, hendrerit in,
ante. Mauris ut dolor quis massa luctus interdum. Mauris quis libero.
Aenean accumsan tellus sed nunc.
</p>
<p>Nullam dictum pulvinar diam. In nisi leo, interdum eget, vestibulum
sit amet, blandit lacinia, justo. Donec nisi. Suspendisse at lacus. In
sit amet lorem. Sed pretium, leo sed pulvinar rhoncus, sapien urna
pulvinar urna, nec porta odio arcu eget quam. Cras varius condimentum
elit. Phasellus massa dolor, dictum adipiscing, ultricies et, rhoncus
eu, ligula. Nunc placerat ultrices ante. Praesent ac tortor. Quisque
suscipit, mauris sed scelerisque placerat, felis justo venenatis dui,
sit amet sodales lacus lorem ac diam. Lorem ipsum dolor sit amet,
consectetuer adipiscing elit.
</p>
<p>
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Nunc
lobortis nulla vel ante molestie facilisis. Fusce nec mauris. Integer
in velit. Suspendisse tellus. Nulla fermentum. Aliquam sapien erat,
vulputate vel, imperdiet eu, fringilla id, dui. Fusce in elit. Duis
condimentum tellus nec sem. Mauris hendrerit. Ut tortor lacus, volutpat
eu, auctor sed, porta eu, ipsum. Fusce ornare, diam blandit fermentum
imperdiet, nunc est posuere lacus, eget dignissim lacus velit porta mi.
Nullam sed tellus a est volutpat mattis. Nulla cursus erat ut enim.
Fusce nisi est, tempus id, facilisis eu, auctor a, quam. In feugiat
venenatis orci. Praesent sed est. Mauris sapien metus, consequat eu,
tincidunt eu, dapibus ut, massa. Nam nunc. Sed suscipit, diam non
commodo pretium, felis augue sollicitudin quam, ut gravida urna urna
nec sapien.
</p>
<p>Nunc eget purus. Vivamus pellentesque erat id massa. Ut nisi. Fusce
tincidunt nulla vel neque. Nulla facilisi. Maecenas molestie. Morbi
erat massa, pellentesque sit amet, mollis nec, sagittis nec, turpis.
Etiam non felis. Donec diam dui, posuere eget, pulvinar in, vestibulum
cursus, nulla. Aenean fringilla diam. In accumsan fringilla metus.
Pellentesque porta, mauris sed dictum blandit, orci augue fringilla
ante, sed sodales dui erat nec lacus. Vivamus felis elit, hendrerit
vel, dapibus vitae, euismod eget, velit.
</p>
<p>Nullam vitae justo placerat nunc elementum tempus. Suspendisse
molestie ligula nec pede. Mauris in nisi sit amet lectus ultrices
adipiscing. Mauris ante eros, lacinia sed, aliquam a, laoreet vel,
pede. Etiam sed nisl. Proin risus turpis, consectetuer sit amet, porta
et, laoreet at, nulla. Lorem ipsum dolor sit amet, consectetuer
adipiscing elit. Quisque placerat, lectus vitae consequat tempus,
ligula nunc tincidunt est, nec aliquam metus quam et sem. Vivamus
eleifend, tortor vel ultricies porta, urna sem interdum lectus, et
fermentum pede erat quis lacus. Phasellus volutpat, diam sit amet
volutpat sodales, felis diam volutpat mi, ac viverra nibh nibh ac
metus. Suspendisse potenti. Phasellus nisl magna, lacinia non, pretium
quis, dictum eget, risus. Sed rutrum. Phasellus at ipsum. Pellentesque
lacus lorem, porttitor eu, hendrerit eu, sodales id, lacus. Nunc nibh.
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Nunc
porttitor.
</p>
<p>Etiam viverra pede in elit. Nunc accumsan fermentum arcu. In aliquet
nisl ac mauris. Nunc dolor. Etiam dapibus vestibulum lectus. Nulla quis
est nec lorem imperdiet porttitor. Morbi a ligula vitae leo feugiat
elementum. Vivamus augue sem, egestas nec, ultricies vitae,
consectetuer non, metus. Vestibulum ante ipsum primis in faucibus orci
luctus et ultrices posuere cubilia Curae; Quisque risus diam, ultricies
at, tempus ac, rutrum ac, nisl. Quisque non augue. Nullam a diam sit
amet magna volutpat porttitor. Donec convallis elit at tortor. Etiam
vulputate, libero sed placerat tincidunt, arcu erat auctor lacus, ac
adipiscing quam nibh eu quam. Fusce commodo pede eu velit. Aenean sit
amet nunc. Phasellus justo dui, congue in, pretium a, hendrerit in,
ante. Mauris ut dolor quis massa luctus interdum. Mauris quis libero.
Aenean accumsan tellus sed nunc.
</p>
<p>Nullam dictum pulvinar diam. In nisi leo, interdum eget, vestibulum
sit amet, blandit lacinia, justo. Donec nisi. Suspendisse at lacus. In
sit amet lorem. Sed pretium, leo sed pulvinar rhoncus, sapien urna
pulvinar urna, nec porta odio arcu eget quam. Cras varius condimentum
elit. Phasellus massa dolor, dictum adipiscing, ultricies et, rhoncus
eu, ligula. Nunc placerat ultrices ante. Praesent ac tortor. Quisque
suscipit, mauris sed scelerisque placerat, felis justo venenatis dui,
sit amet sodales lacus lorem ac diam. Lorem ipsum dolor sit amet,
consectetuer adipiscing elit.
</p>
</div>
</body>
</html>