작업

메모는 끌어서 놓기, 크기 조정, 이동 등과 같은 작업을 지원합니다.

다음 키는 메모 작업을 위한 작업을 제공합니다. Esc: 주석이 편집 상태에 있는 경우 Esc 키를 누르면 주석이 활성 상태가 됩니다. Esc 키를 다시 누르면 주석이 선택 취소됩니다. Delete: 주석을 선택하고 상태가 활성인 경우 삭제를 Delete 키를 누르면 선택한 주석이 삭제됩니다. Up: 주석을 선택하고 상태가 활성인 경우 위쪽 화살표를 누르면 주석이 위로 이동합니다. Down: 주석을 선택하고 상태가 활성인 경우 아래쪽 화살표를 누르면 주석이 아래쪽으로 이동합니다. Left: 주석을 선택하고 상태가 활성인 경우 왼쪽 화살표를 누르면 주석이 왼쪽으로 이동합니다. Right: 주석을 선택하고 상태가 활성인 경우 오른쪽 화살표를 누르면 주석이 오른쪽으로 이동합니다. 마우스 동작을 사용하여 메모와 상호 작용할 수도 있습니다. 메모를 선택하면 위치 표시기와 여덟 개의 크기 조정 표시기가 표시됩니다. 크기 조정 표시기를 끌어서 메모의 크기를 조정할 수 있습니다. 또한 메모를 끌어서 다른 위치에 놓을 수 있습니다.
window.onload = function () { var spread = new GC.Spread.Sheets.Workbook(document.getElementById("ss")); initSpread(spread); }; function initSpread(spread) { var sheet = spread.getSheet(0); sheet.addSpan(1, 1, 1, 6); sheet.setValue(1, 1, "you can drag to resize the comment"); var comment = sheet.comments.add(1, 1, "new comment!"); comment.displayMode(GC.Spread.Sheets.Comments.DisplayMode.alwaysShown); };
<!doctype html> <html style="height:100%;font-size:14px;"> <head> <meta name="spreadjs culture" content="ko-kr"/> <meta charset="utf-8" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <link rel="stylesheet" type="text/css" href="$DEMOROOT$/ko/purejs/node_modules/@mescius/spread-sheets/styles/gc.spread.sheets.excel2013white.css"> <script src="$DEMOROOT$/ko/purejs/node_modules/@mescius/spread-sheets/dist/gc.spread.sheets.all.min.js" type="text/javascript"></script> <script src="$DEMOROOT$/ko/purejs/node_modules/@mescius/spread-sheets-resources-ko/dist/gc.spread.sheets.resources.ko.min.js" type="text/javascript"></script> <script src="$DEMOROOT$/spread/source/js/license.js" type="text/javascript"></script> <script src="app.js" type="text/javascript"></script> <link rel="stylesheet" type="text/css" href="styles.css"> </head> <body> <div class="sample-tutorial"> <div id="ss" style="width:100%; height:100%;border: 1px solid gray;"></div> </div> </body> </html>
.sample-tutorial { position: relative; height: 100%; overflow: hidden; } body { position: absolute; top: 0; bottom: 0; left: 0; right: 0; }