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.
77 lines
2.6 KiB
77 lines
2.6 KiB
2 years ago
|
<html>
|
||
|
|
<script type="text/javascript" src="../dojo.js"></script>
|
||
|
|
<script type="text/javascript">
|
||
|
|
dojo.require('dojo.html.common');
|
||
|
|
dojo.require('dojo.html.style');
|
||
|
|
dojo.require("dojo.event");
|
||
|
|
dojo.require("dojo.lang.declare");
|
||
|
|
|
||
|
|
function $ (id) { return dojo.byId(id); }
|
||
|
|
function makeGreen (nodes) { for (var i = 0; node = nodes[i]; i++) { node.style.color = "green"; } }
|
||
|
|
|
||
|
|
|
||
|
|
var contentWin;
|
||
|
|
dojo.addOnLoad(function(){
|
||
|
|
contentWin = $("embed").contentWindow;
|
||
|
|
dojo.event.connect($("updateScroll"), "onclick", updateScroll);
|
||
|
|
dojo.event.connect($("updateScrollOffset"), "onclick", updateScrollOffset);
|
||
|
|
dojo.event.connect($("updateViewport"), "onclick", updateViewport);
|
||
|
|
dojo.event.connect($("init"), "onclick", init);
|
||
|
|
});
|
||
|
|
|
||
|
|
function updateScroll() {
|
||
|
|
dojo.withGlobal(contentWin, function() {
|
||
|
|
var scroll = dojo.html.getScroll();
|
||
|
|
$("scrollTop").firstChild.nodeValue = scroll.top;
|
||
|
|
$("scrollLeft").firstChild.nodeValue = scroll.left;
|
||
|
|
});
|
||
|
|
}
|
||
|
|
|
||
|
|
function updateScrollOffset() {
|
||
|
|
dojo.withGlobal(contentWin, function() {
|
||
|
|
var offset = dojo.html.getScroll().offset;
|
||
|
|
$("scrollOffsetX").firstChild.nodeValue = offset.x;
|
||
|
|
$("scrollOffsetY").firstChild.nodeValue = offset.y;
|
||
|
|
});
|
||
|
|
}
|
||
|
|
|
||
|
|
//use object context to invoke a member function of an object
|
||
|
|
var ViewPort = {};
|
||
|
|
ViewPort.update = function(msg){
|
||
|
|
var viewport = dojo.html.getViewport();
|
||
|
|
$("viewportWidth").firstChild.nodeValue = viewport.width;
|
||
|
|
$("viewportHeight").firstChild.nodeValue = viewport.height;
|
||
|
|
$("viewportSize").firstChild.nodeValue = viewport + msg;
|
||
|
|
}
|
||
|
|
|
||
|
|
function updateViewport() {
|
||
|
|
dojo.withGlobal(contentWin, "update", ViewPort, " updateViewport is clicked" );
|
||
|
|
}
|
||
|
|
|
||
|
|
function init() {
|
||
|
|
makeGreen(dojo.html.getElementsByClass("foo1 bar1"));
|
||
|
|
makeGreen(dojo.html.getElementsByClass("foo2", null, null, dojo.html.classMatchType.ContainsAll));
|
||
|
|
makeGreen(dojo.html.getElementsByClass("foo3 bar3", null, null, dojo.html.classMatchType.IsOnly));
|
||
|
|
makeGreen(dojo.html.getElementsByClass("foo4", null, null, dojo.html.classMatchType.IsOnly));
|
||
|
|
}
|
||
|
|
|
||
|
|
//use around to wrap a function to work in the embed window
|
||
|
|
dojo.event.connect("around", this, "init", this, "withEmbed");
|
||
|
|
function withEmbed(mi) {
|
||
|
|
dojo.withGlobal(contentWin, function() { mi.proceed(); });
|
||
|
|
}
|
||
|
|
|
||
|
|
</script>
|
||
|
|
<head>
|
||
|
|
</head>
|
||
|
|
<body>
|
||
|
|
<p>This text is before the iframe</p>
|
||
|
|
<iframe id="embed" src="test_html_content.html" width="50%" height="200px"></iframe>
|
||
|
|
<p><input type="button" id="init" value="Init green text">
|
||
|
|
<input type="button" id="updateScroll" value="Update Scroll Values">
|
||
|
|
<input type="button" id="updateScrollOffset" value="Update Scroll Values">
|
||
|
|
<input type="button" id="updateViewport" value="Update Size Values"></p>
|
||
|
|
<p style="height: 700px"></p>
|
||
|
|
</body>
|
||
|
|
</html>
|