rico-using

最新推荐文章于 2025-12-31 16:31:20 发布

原创最新推荐文章于 2025-12-31 16:31:20 发布 · 1.2k 阅读

1 ·

CC 4.0 BY-SA版权

文章标签：

#class #div #function #javascript #null #table

Ajax 专栏收录该内容

1 篇文章

订阅专栏

<script type="text/javascript"
       src="你的js目录/prototype.js">
</script>
<script type="text/javascript"
       src="你的js目录/rico.js">
</script>




<BODY onload=javascript:bodyOnLoad()>
<SCRIPT>
    var onloads = new Array();
    function bodyOnLoad() {
       new Rico.Effect.Round( null, 'roundNormal' );
       new Rico.Effect.Round( null, 'roundCompact', {compact:true} );
       for ( var i = 0 ; i < onloads.length ; i++ )
          onloads[i]();
    }
   showMenuContext()
</SCRIPT>
<TABLE>
<TBODY>
<TR>
    <TD>
      <DIV id=accordionExample style="BORDER-TOP: 1px solid; MARGIN-TOP: 6px">
        <DIV id=panel1>
          <DIV class=accordionTabTitleBar id=panel1Header>panel1</DIV>
          <DIV class=accordionTabContentBox id=panel1Content>xxxxx</DIV>
        </DIV>
        <DIV id=panel2>
          <DIV class=accordionTabTitleBar id=panel2Header>panel2</DIV>
          <DIV class=accordionTabContentBox id=panel2Content>xxxxx</DIV>
        </DIV>
      <DIV>
      <SCRIPT> onloads.push( accord ); function accord() { new Rico.Accordion(                               'accordionExample', {panelHeight:227} ); } </SCRIPT>
    </TD>
</TR>
</TBODY>
</TABLE>
</BODY>

<BODY>
<SCRIPT>
var saveHeight;
var showing = true;

   function toggleSlide() {
      if ( showing )
         { slideMenuUp(); showing = false; }
      else
         { slideMenuDown(); showing = true; }
   }

   function slideMenuUp() {
      var menu = $('demosMenu');
      saveHeight = menu.offsetHeight;

menu.style.overflow = "hidden";
new Rico.Effect.Size( menu, null, 1, 120, 8 );

$('demoPanelLink').innerHTML = "显示面板";
}

function slideMenuDown() {
      var menu = $('demosMenu');
      new Rico.Effect.Size( menu, null, saveHeight, 120, 8, {complete:function() { $(menu).style.overflow = "visible"; }} );
      $('demoPanelLink').innerHTML = "隐藏面板";
   }
</SCRIPT>

<DIV style="MARGIN-LEFT: 6px"><A id=demoPanelLink
href="javascript:toggleSlide();">隐藏面板</A></DIV>
<DIV id=demosMenu ondblclick=toggleSlide()
style="MARGIN-TOP: 2px; PADDING-LEFT: 6px; MARGIN-LEFT: 2px; WIDTH: 575px; BACKGROUND-COLOR: #adba8c">
<TABLE style="MARGIN-TOP: 6px; MARGIN-BOTTOM: 6px" cellPadding=0>
<TBODY>
<TR>
    <TD class=portalBox id=ajaxDemos1>
      <DIV class=leftPadding><SPAN class=header>AJAX DEMOS</SPAN> <A
      class=demoLinks
      href="http://openrico.org/rico/demos.page?demo=rico_ajax_inner_HTML">Inner
      Html</A> <A class=demoLinks
      href="http://openrico.org/rico/demos.page?demo=rico_ajax_complex">Javascript
      Updater</A>
      </DIV>
      <br><br>
    </TD>
    <TD class=portalBox id=ajaxDemos2>
      <DIV class=leftPadding><SPAN class=header>AJAX DEMOS</SPAN> <A
      class=demoLinks
      href="http://openrico.org/rico/demos.page?demo=rico_ajax_inner_HTML">Inner
      Html</A> <A class=demoLinks
      href="http://openrico.org/rico/demos.page?demo=rico_ajax_complex">Javascript
      Updater</A> <A class=demoLinks
      href="http://openrico.org/rico/demos.page?demo=rico_ajax_complex">Javascript
      Updater</A> <A class=demoLinks
      href="http://openrico.org/rico/demos.page?demo=rico_ajax_complex">Javascript
      Updater</A>
      </DIV>
    </TD>
<TR>
</TBODY>
</TABLE>
</DIV>
<SCRIPT>
Rico.Corner.round( 'ajaxDemos1',     {corners:'tl br',bgColor:'#adba8c'} );
Rico.Corner.round( 'ajaxDemos2',     {corners:'tl br',bgColor:'#adba8c'} );
</SCRIPT>
</body>

<BODY onload=javascript:bodyOnLoad()>
<SCRIPT>
    var onloads = new Array();
    function bodyOnLoad() {
       new Rico.Effect.Round( null, 'roundNormal' );
       new Rico.Effect.Round( null, 'roundCompact', {compact:true} );
       for ( var i = 0 ; i < onloads.length ; i++ )
          onloads[i]();
    }
   showMenuContext()
</SCRIPT>
<TABLE>
<TBODY>
<TR>
    <TD>
      
      <DIV id=exampleContainer style="WIDTH: 540px; BACKGROUND-COLOR: #e0ddb5">
        
        <DIV id=dragBox style="DISPLAY: inline; FLOAT: left; MARGIN-BOTTOM: 8px; MARGIN-LEFT: 8px">
          <SPAN class=catHeader>待拖动列表</SPAN>
          <DIV class=listBox id=nameList style="OVERFLOW: auto; WIDTH: 250px; HEIGHT: 140px">
            <SCRIPT>writeNameSpans()</SCRIPT>
          </DIV>
          <SCRIPT>createDraggables()</SCRIPT>
        </DIV>
        
        <DIV id=dropBox style="FLOAT: left; MARGIN-BOTTOM: 8px; MARGIN-LEFT: 8px">
          <SPAN class=catHeader>存储列表</SPAN>
          <DIV class=listBox id=dropZone style="OVERFLOW: auto; WIDTH: 250px; HEIGHT: 140px"></DIV>
        </DIV>
        
        <DIV style="CLEAR: both; MARGIN-LEFT: 8px">
          <SPAN class=catHeader id=loghead>日志记录:</SPAN>
          <DIV class=logBox id=logger style="MARGIN-BOTTOM: 8px; OVERFLOW: auto; WIDTH: 510px; HEIGHT: 140px"></DIV>
        </DIV>
      </DIV>

      <SPAN class=catHeader>列表框</SPAN>
      <DIV class="rc codeBox" id=codeContainer>
        <DIV class=codeBox style="OVERFLOW: auto; HEIGHT: 300px">xxxxxxxxxxxxxxxxx</DIV>
      </DIV>
<SCRIPT>
Rico.Corner.round( 'exampleContainer' );
Rico.Corner.round( 'codeContainer' );
dndMgr.registerDropZone( new Rico.Dropzone($('dropZone')));
</SCRIPT>
</TD></TR></TBODY></TABLE></BODY>

<BODY onload=javascript:bodyOnLoad()>
<SCRIPT>

      <SCRIPT
      src="CUSTOMDROPZONEEXAMPLE.files/ricoDragAndDropCustomDraggable.js"
      type=text/javascript></SCRIPT>
      <SPAN class=header>CUSTOM DROPZONE EXAMPLE </SPAN> <BR><BR>
      <DIV id=exampleContainer style="BACKGROUND-COLOR: #e0ddb5">
      <TABLE cellSpacing=5>
        <TBODY>
        <TR>
          <TD vAlign=top><SPAN class=catHeader
            style="MARGIN-TOP: 0px">name-list</SPAN>
            <DIV class=listBox id=nameList
            style="OVERFLOW: auto; WIDTH: 250px; HEIGHT: 180px; BACKGROUND-COLOR: white">
            <SCRIPT>writeNameSpans()</SCRIPT>
            </DIV>
            <SCRIPT>createDraggables()</SCRIPT>
          </TD>
        </TR>
        </TBODY>
      </TABLE>
      </DIV>
      <TABLE cellSpacing=3 cellPadding=3>
        <TBODY>
        <TR>
          <TD><SPAN class=catHeader id=dz1
            style="PADDING-RIGHT: 0px; PADDING-LEFT: 0px; PADDING-BOTTOM: 2px; PADDING-TOP: 2px">a-g</SPAN>

<SCRIPT>
   dndMgr.registerDropZone( new CustomDropzone('dropZone1', 'dz1', ['a','g']) );
   dndMgr.registerDropZone( new CustomDropzone('dropZone2', 'dz2', ['h','m']) );
   dndMgr.registerDropZone( new CustomDropzone('dropZone3', 'dz3', ['n','z']) );

   Rico.Corner.round('exampleContainer');
   new Rico.Effect.Round( 'div', 'roundMe', {color:'#c6c3de'});
   CustomDraggable.removeOnDrop = true;
   CustomDraggable.revereNamesOnDrop = false;
</SCRIPT>
</TD>
</TR>
</TBODY>
</TABLE>
</BODY>

<BODY onload=javascript:bodyOnLoad()>
<SCRIPT>

    var onloads = new Array();
    function bodyOnLoad() {
       new Rico.Effect.Round( null, 'roundNormal' );
       new Rico.Effect.Round( null, 'roundCompact', {compact:true} );
       for ( var i = 0 ; i < onloads.length ; i++ )
          onloads[i]();
    }
   showMenuContext()
</SCRIPT>
<TABLE>
<TBODY>
<TR>
    <TD>
      <DIV
      style="BORDER-RIGHT: #5b5b5b 1px solid; PADDING-RIGHT: 5px; BORDER-TOP: #5b5b5b 1px solid; PADDING-LEFT: 5px; PADDING-BOTTOM: 5px; BORDER-LEFT: #5b5b5b 1px solid; PADDING-TOP: 5px; BORDER-BOTTOM: #5b5b5b 1px solid; HEIGHT: 50px">
      <DIV class=box id=dragme style="BACKGROUND: #f7a673">Drag
      Me</DIV></DIV><BR>
      <TABLE style="MARGIN-BOTTOM: 8px" cellSpacing=3 cellPadding=3>
        <TBODY>
        <TR>
          <TD>
            <DIV class=simpleDropPanel id=droponme style="BACKGROUND: #ffd773">
            <DIV class=title>Drop On Me</DIV></DIV></TD>
          <TD>
            <DIV class=simpleDropPanel id=droponme2 style="BACKGROUND: #c6c3de">
            <DIV class=title>Drop On Me 2</DIV></DIV></TD></TR></TBODY></TABLE>
<SCRIPT>
   dndMgr.registerDraggable( new Rico.Draggable('test-rico-dnd','dragme') );
   dndMgr.registerDropZone( new Rico.Dropzone('droponme') );
   dndMgr.registerDropZone( new Rico.Dropzone('droponme2') );
</SCRIPT>
    </TD></TR></TBODY></TABLE></BODY>