You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
189 lines
9.2 KiB
189 lines
9.2 KiB
<?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>
|
|
|