examples/extra.html

<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8">
<title>CardKit Reference</title>
<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0">
<meta name="format-detection" content="telephone=no">

<link href="static/css/main.css" rel="stylesheet">
<link href="css/shCoreDefault.css" rel="stylesheet">
<link href="css/console.css" rel="stylesheet">
<link href="css/common.css" rel="stylesheet">
<style>
</style>
<script>function ckControl(){return false}</script>
</head>
<body ontouchstart="return ckControl()">


<div class="ck-root"><div class="ck-main">
    
<header class="ck-header">
    
<span class="ck-top-title">CardKit Ref</span>
<span class="ck-top-nav"></span>
<span class="ck-top-actions"></span>

<div class="ckcfg-navdrawer">
    <div class="ckd-hd">
        <h2>CardKit Reference</h2>
    </div>
    <div class="ckd-content">
        <div class="search">
            <a class="ck-modal-link" href="#"
                data-url="formcontent.html">search</a>
        </div>
        <ul>
            <li><a class="ck-link" href="index.html">Home</a></li>
        </ul>
        <h6>Cross-platform</h6>
        <ul>
            <li><a class="ck-link" href="grade.html">Graded Browser Support</a></li>
            <li><a class="ck-link" href="browsers.html">Compatibility testing</a></li>
            <li><a class="ck-link" href="#consoleCard">Console</a></li>
        </ul>
        <h6>Component</h6>
        <ul>
            <li><a class="ck-link" href="control.html">Control</a></li>
            <li><a class="ck-link" href="picker.html">Picker</a></li>
            <li><a class="ck-link" href="overlay.html">Overlay</a></li>
        </ul>
        <h6>Unit</h6>
        <ul>
            <li><a class="ck-link" href="box.html">Box</a></li>
            <li><a class="ck-link" href="list.html">List</a></li>
            <li><a class="ck-link" href="mini.html">Mini</a></li>
            <li><a class="ck-link" href="form.html">Form</a></li>
            <li><a class="ck-link" href="extra.html">Extra</a></li>
        </ul>
    </div>
</div>

<div class="ckcfg-card-actions">
</div>

<div class="ckcfg-page-actions">
    <button type="button" class="ckd-overflow-item switchstyle">切换界面风格</button>
</div>

</header>

<div class="ck-wrapper">

    <div class="ck-card" id="ckDefault">

        <div class="ck-banner-unit topbox">
            <h2>CardKit / Unit</h2>
        </div>

        <div class="ck-box-unit" data-cfg-paper="true">
            <header class="ckd-hd">Extra Unit</header>
        </div>

        <div class="ck-list-unit" data-style="slide" data-cfg-blank="Coming soon...">
            <header class="ckd-hd">Source code</header>
        </div>

    </div>

    <div class="ck-card" id="consoleCard">

        <div class="ck-box-unit" data-cfg-paper="true">
            <header class="ckd-hd">Console</header>
            <div id="console"></div>
        </div>

        <script type="text/cardscript">
        this.addEventListener('card:ready', function(e){
            require(['mo/console'], function(console){
                console.config({
                    record: false,
                    output: e.card.find('#console')[0]
                });
            });
        });
        </script>

    </div>

    <div class="ck-card" id="rawCard">

        <div class="ck-box-unit" data-cfg-plainhd="true">
            <header class="ckd-hd">Raw source</header>
            <div class="ck-folder enabled"
                    data-disable-label="Hide the code" 
                    data-label="header">
                <header>Hide the code</header>
                <div class="democode content" gsource="rawData1"></div>
            </div>
        </div>

    </div>

    <div class="ck-card" id="optionsCard">
    </div>

    <div class="ck-card ck-loading" id="ckLoading">
        <div>
            <p><span></span><span></span><span></span></p>
            <p>加载中...</p>
        </div>
    </div>

    <footer class="ck-footer">
        <div class="copyright">&copy; 2005－2012 douban.com, all rights reserved</div>
    </footer>

</div>

</div></div>

<script src="js/shCore.js"></script>
<script src="js/shBrushXml.js"></script>
<script src="js/shBrushJScript.js"></script>
<script src="static/js/main.js"></script>
<!-- COLLECTED JS -->
<script id="jsdemo1">
</script>
<script src="js/common.js"></script>
</body>
</html>