Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

希望提供灵活自定义封面内容的能力 #507

Closed
Lizhooh opened this issue May 29, 2018 · 0 comments
Closed

希望提供灵活自定义封面内容的能力 #507

Lizhooh opened this issue May 29, 2018 · 0 comments

Comments

@Lizhooh
Copy link

Lizhooh commented May 29, 2018

我发现，封面只能从 markdown 里读取，不能做到一个灵活的自定义内容（包括样式等）。

现在我只能这样做来实现灵活的自定义封面的内容。

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title></title>
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
    <meta name="description" content="Description">
    <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
    <link href="https://cdn.bootcss.com/docsify/4.6.10/themes/vue.css" rel="stylesheet">
    <style>
        .cover {
            display: none !important;
        }
    </style>
</head>
<body>
    <!-- 自定义内容 -->
    <template id="index_temp">
        <div style="text-align: center">
            <h2>Hello</h2>
            <a href="/#/readme">开始</a>
        </div>
    </template>
    <div id="index_view"></div>
    <div id="app"></div>
    <script>
        function renderIndexView() {
            var $ = document.querySelector.bind(document);
            if (window.location.hash === '#/') {
                $('#index_view').innerHTML = $('#index_temp').innerHTML;
            }
            else {
                $('#index_view').innerHTML = '';
            }
        }
        window.addEventListener('hashchange', renderIndexView);
        renderIndexView();

        window.$docsify = {
            name: 'Hello',
            repo: '',
            loadSidebar: true,
            coverpage: true,
            onlyCover: true,
        };
    </script>
    <script src="https://cdn.bootcss.com/docsify/4.6.10/docsify.min.js"></script>
    <script src="https://cdn.bootcss.com/docsify/4.6.10/plugins/zoom-image.min.js"></script>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees
No one assigned
Labels
None yet
Projects
None yet
Milestone
No milestone
Development

No branches or pull requests
1 participant
@Lizhooh