diff options
Diffstat (limited to 'examples/example11-autoheight.html')
-rw-r--r-- | examples/example11-autoheight.html | 131 |
1 files changed, 75 insertions, 56 deletions
diff --git a/examples/example11-autoheight.html b/examples/example11-autoheight.html index 885d60e..072bd60 100644 --- a/examples/example11-autoheight.html +++ b/examples/example11-autoheight.html @@ -1,65 +1,84 @@ <!DOCTYPE html> <html lang="en"> - <head> - <meta http-equiv="X-UA-Compatible" content="IE=edge" /> - <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> - <title>SlickGrid example 11: No vertical scrolling (autoHeight)</title> - <link rel="stylesheet" href="../slick.grid.css" type="text/css" media="screen" charset="utf-8" /> - <link rel="stylesheet" href="examples.css" type="text/css" media="screen" charset="utf-8" /> - <style> - html,body { margin:0; padding:0; overflow:auto; } - body { font:11px Helvetica,Arial,sans-serif; } - #container { margin:10px; border:solid 1px gray; width:480px; background:white;} - #description { position:fixed; top:30px; right:30px; width:25em; } - </style> - </head> - <body> - <div id="container"></div> - <div id="description"> - <h2>Demonstrates:</h2> - <ul> - <li>autoHeight:true grid option</li> - </ul> - </div> +<head> + <meta http-equiv="X-UA-Compatible" content="IE=edge"/> + <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/> + <title>SlickGrid example 11: No vertical scrolling (autoHeight)</title> + <link rel="stylesheet" href="../slick.grid.css" type="text/css" /> + <link rel="stylesheet" href="examples.css" type="text/css" /> + <style> + html, body { + margin: 0; + padding: 0; + overflow: auto; + } - <script src="../lib/jquery-1.7.min.js"></script> - <script src="../lib/jquery-ui-1.8.16.custom.min.js"></script> - <script src="../lib/jquery.event.drag-2.0.min.js"></script> + body { + font: 11px Helvetica, Arial, sans-serif; + } - <script src="../slick.core.js"></script> - <script src="../slick.grid.js"></script> + #container { + margin: 10px; + border: solid 1px gray; + width: 480px; + background: white; + } - <script> - var grid, - data = [], - columns = [ - { id:"title", name:"Title", field:"title" }, - { id:"duration", name:"Duration", field:"duration" }, - { id:"%", name:"% Complete", field:"percentComplete" }, - { id:"start", name:"Start", field:"start" }, - { id:"finish", name:"Finish", field:"finish" }, - { id:"effort-driven", name:"Effort Driven", field:"effortDriven" } - ], - options = { - editable: false, - enableAddRow: false, - enableCellNavigation: false, - autoHeight: true - }; + #description { + position: fixed; + top: 30px; + right: 30px; + width: 25em; + } + </style> +</head> +<body> +<div id="container"></div> +<div id="description"> + <h2>Demonstrates:</h2> + <ul> + <li>autoHeight:true grid option</li> + </ul> +</div> - for (var i = 100; i-- > 0;) { - data[i] = { - title: "Task " + i, - duration: "5 days", - percentComplete: Math.round(Math.random() * 100), - start: "01/01/2009", - finish: "01/05/2009", - effortDriven: (i % 5 == 0) - }; - } +<script src="../lib/jquery-1.7.min.js"></script> +<script src="../lib/jquery-ui-1.8.16.custom.min.js"></script> +<script src="../lib/jquery.event.drag-2.0.min.js"></script> - grid = new Slick.Grid("#container", data, columns, options); - </script> +<script src="../slick.core.js"></script> +<script src="../slick.grid.js"></script> - </body> +<script> + var grid, + data = [], + columns = [ + { id:"title", name:"Title", field:"title" }, + { id:"duration", name:"Duration", field:"duration" }, + { id:"%", name:"% Complete", field:"percentComplete" }, + { id:"start", name:"Start", field:"start" }, + { id:"finish", name:"Finish", field:"finish" }, + { id:"effort-driven", name:"Effort Driven", field:"effortDriven" } + ], + options = { + editable:false, + enableAddRow:false, + enableCellNavigation:false, + autoHeight:true + }; + + for (var i = 100; i-- > 0;) { + data[i] = { + title:"Task " + i, + duration:"5 days", + percentComplete:Math.round(Math.random() * 100), + start:"01/01/2009", + finish:"01/05/2009", + effortDriven:(i % 5 == 0) + }; + } + + grid = new Slick.Grid("#container", data, columns, options); +</script> + +</body> </html>
\ No newline at end of file |