如何使用Prototype窗口类

时间:2009-09-08 17:30:46

标签: windows prototype

好的..继续使用示例的网站..

原型窗口类xilinus.com

prototype-window.xilinus.com/samples.html

我想在我的网站上使用swf内容的第三个(3)示例,但我无法理解代码和如何...特别是调用脚本(一个href =#onclick = mplampla()嵌入。 ... / embed / a

1 个答案:

答案 0 :(得分:0)

//if the content in the window is not empty alert something
if (contentWin != null) {
  Dialog.alert("Close the window 'Test' before opening it again!",{width:200, height:130}); 
}
//otherwise instaciate a new window with the following options
else {
  contentWin = new Window({maximizable: false, resizable: false, hideEffect:Element.hide, showEffect:Element.show, minWidth: 10, destroyOnClose: true})
  //replace the content of the window with the content and the element itself of the element with the id 'test_content'
  //true, true stands for: autoresize (default false), autoposition (default false)
  contentWin.setContent('test_content', true, true)
  contentWin.show();    

  /* Set up a windows observer, check ou debug window to get messages
   * if the window gets closed by clicking on the red x than the element 'test_content' gets inserted into the 'container' element
   * this method is used to display the content after closing the window.
   * and the contentWin object gets dereferenced by calling =null;
   */
  myObserver = {
    onDestroy: function(eventName, win) {
      if (win == contentWin) {
        $('container').appendChild($('test_content'));//         <----------------
        contentWin = null;
        Windows.removeObserver(this);
      }
      debug(eventName + " on " + win.getId())
    }
  }
  Windows.addObserver(myObserver);
}

所以如果你像这样嵌入了flash:

<object id="flash" width="550" height="400">
<param name="movie" value="somefilename.swf">
<embed src="somefilename.swf" width="550" height="400">
</embed>
</object>

你要用这个替换我做箭头的那条线:

$('container').appendChild($('flash'));

这里更清楚的是示例#3的html:

<p class="description">
          <div id="container">
               <div id="test_content" style="float:right;width:100px; height:150px;background:#DFA; color:#000; font-size:12px;">
                   Lorem ipsum dolor sit amet, consectetur adipiscing elit
              </div>
            This sample opens a window with green div on the right as content. It will keep the same size and position. Close the window to restore the div in the page.<br/>
            It also uses a window observer to restore the div after closing the window.
</div>
</p>

总而言之,这应该有所帮助:

<div id="container">
<object id="flash" width="550" height="400">
<param name="movie" value="somefilename.swf">
<embed src="somefilename.swf" width="550" height="400">
</embed>
</object>
</div>

<script type="javascript/text" language="javascript"> 
  contentWin = new Window({maximizable: false, resizable: false, hideEffect:Element.hide, showEffect:Element.show, minWidth: 10, destroyOnClose: true})
  contentWin.setContent('flash', true, true)
  contentWin.show();    

  myObserver = {
    onDestroy: function(eventName, win) {
      if (win == contentWin) {
        $('container').appendChild($('flash'));
        contentWin = null;
        Windows.removeObserver(this);
      }
      debug(eventName + " on " + win.getId())
    }
  }
  Windows.addObserver(myObserver);
</script>