Analytics

2017年2月15日 星期三

[Javascript]如何 使用Javascript產生動態遮罩 (How to generate dynamic masks)


問題
如何 使用Javascript產生動態遮罩



解決方法
  1. <script language="javascript">
  2. var docEle = function() {
  3. return document.getElementById(arguments[0]) || false;
  4. }
  5.  
  6. function showMask() {
  7. createMask();
  8. }
  9.  
  10. function hideMask() {
  11. var m = "autoMask";
  12. if (docEle(m)) document.removeChild(docEle(m));
  13. }
  14.  
  15. function createMask() {
  16. var m = "autoMask";
  17. if (docEle(m)) document.removeChild(docEle(m));
  18. var newDiv = document.createElement("div");
  19. newDiv.id = 'autoMask';
  20. newDiv.style.cssText="zoom: 1;filter: alpha(opacity=50);opacity: 0.5;width: 100%;background-color: Gray;height: 100%;position: absolute;left: 0;top: 0;z-index: 9999999;text-align: center;margin-top: 0px;";
  21. newDiv.innerHTML="<table width='100%'><tr><td style='height: 300px;text-align: center;'><h2>L O A D I N G . . . . . .</h2></td></tr></table>";
  22. document.body.appendChild(newDiv);
  23. }
  24.  
  25. </script>
  1. <body>
  2. <a href="#" onclick="showMask();">showMask</a>
  3. </body>

沒有留言:

熱門文章