2011年12月20日星期二
index.html
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> <html> <head> <title>HTML5</title> </head> <script type="text/javascript" src="http://achau.appspot.com/js_/util.js%22%3E%3C/script> <script type="text/javascript"> var url1 = 'http://achau.appspot.com/demo/html5/crossdoc/iframe1.html'; var url2 = 'http://austinchau.googlecode.com/svn/trunk/demo/html5/crossdoc/iframe2.html'; var iframeWidth = 300; var iframeHeight = 200; var frameborder = 1; window.onload = function() { // check if HTML5 cross document 'postMessage' is supported if (typeof window.postMessage == 'undefined') { var div = document.createElement('div'); div.innerHTML = 'Sorry your browser does not support the ' + '<a href="http://www.whatwg.org/specs/web-apps/current-work/#crossDocumentMessages">HTML5 Cross-Document Messaging.</a>' + '<br>Please use Firefox 3 or IE8.'; document.body.innerHTML = ''; document.body.appendChild(div); return; } buildIframes(); }; function buildIframes() { var iframe1 = document.createElement('iframe'); iframe1.src = url1; iframe1.width = iframeWidth; iframe1.height = iframeHeight; iframe1.frameborder = frameborder; iframe1.style.border = 'solid black 1px;'; var iframe2 = document.createElement('iframe'); iframe2.src = url2; iframe2.width = iframeWidth; iframe2.height = iframeHeight; iframe2.frameborder = frameborder; iframe2.style.border = 'solid black 1px;'; document.body.appendChild(iframe1); document.body.appendChild(iframe2); } </script> <style> body { font-size: 12px; color: gray; } </style> <body> This sample demonstrates two iframes of different domains passing their respective mouse coordinates to each other using <a href="http://www.whatwg.org/specs/web-apps/current-work/#crossDocumentMessages">HTML5 Cross-Document Messaging.</a> <br><br> [ <a href='http://code.google.com/p/austinchau/source/browse/#svn/trunk/demo/html5/crossdoc'>Source code</a> ] <br><br> * Move your mouse over the two iframes <br><br> </body> </html>
订阅：
博文评论 (Atom)
没有评论:
发表评论