IPython/Jupyter notebook 3 - 默认隐藏标题答案

【问题标题】：IPython/Jupyter notebook 3 - hide headers by defaultIPython/Jupyter notebook 3 - 默认隐藏标题
【发布时间】：2015-05-06 17:26:46
【问题描述】：

在 IPython 笔记本版本 3.0 之前，可以通过将其添加到“.ipython\profile_default\static\custom\custom.js”（在 Windows 上）来默认隐藏笔记本标题：

$([IPython.events]).on("app_initialized.NotebookApp", function () {
    $('div#header').hide();
    $('div#maintoolbar').hide();
});

或者对于 Jupyter，“~/.jupyter/custom/custom.js”，将IPython 替换为Jupyter。

also see this question

这似乎不再起作用了。它隐藏了标题，但它也在页面的顶部和底部留下了很大的空隙。我不熟悉javascript和css。有人找到解决方案了吗？

【问题讨论】：

标签： ipython customization ipython-notebook jupyter jupyter-notebook

【解决方案1】：

将此添加到您个人资料中的 custom.css（例如 ~/.ipython/profile_default/static/custom/custom.css 对我来说）：

div#site{
    height: 100% !important;
}

删除底部任何令人讨厌的灰色空间。另外，我将它添加到我的 custom.js（同一文件夹）中以使用 ctrl-` 切换标题：

$([IPython.events]).on('notebook_loaded.Notebook', function(){
    $('#header').hide();

    IPython.keyboard_manager.command_shortcuts.add_shortcut('ctrl-`', function (event) {
        if (IPython.notebook.mode == 'command') {
            $('#header').toggle();
            return false;
        }
        return true;
    });
});

不利的一面是，您可能会不小心将页眉部分滚动到页面外，但这只有在您滚动它时才会发生，这没什么大不了的，尤其是如果您无论如何都想隐藏它。

【讨论】：

效果很好，谢谢！请注意：这完全隐藏了标题。我之前使用的解决方案使菜单保持不变。所以你现在真的必须使用 ctrl+` 快捷方式。不过，我什至更喜欢这种方式。
除了充分利用全高，还可以remove the gray space on the sides，在.container { width:100% !important; }后加~/.ipython/profile_default/static/custom/custom.css。
另外注意，如果你偶然使用 Jupyter notebook，你需要jupyter migrate 以便相同的 js 和 css 文件在 jupyter 中工作 - jupyter.readthedocs.org/en/latest/migrating.html
您可能还需要重新启动笔记本服务器才能使 css 更改生效。
这应该是一个扩展

【解决方案2】：

在 ipython 3 中，#header 指的是页面顶部的完整程序集，而不仅仅是 ipython 2 中的图像横幅。

为了永久隐藏工具栏和标题同时保留菜单，我添加了

$([IPython.events]).on("app_initialized.NotebookApp", function () {
    $('div#header-container').hide();
    $('div#maintoolbar').hide();
});

致我的~/.ipython/profile_name/static/custom/custom.js

【讨论】：

【解决方案3】：

结合@John_C 和@cknd 的答案并避免使用`-key（这是我的（荷兰语）键盘布局上的死键），我将其添加到我的~/.ipython/profile_name/static/custom/custom.js：

$([IPython.events]).on('notebook_loaded.Notebook', function(){
    $('#header').hide();
    IPython.keyboard_manager.command_shortcuts.add_shortcut('ctrl-;', function (event) {
        if (IPython.notebook.mode == 'command') {
            $('#header').toggle();
            return false;
        }
        return true;
    });

    IPython.keyboard_manager.command_shortcuts.add_shortcut('ctrl-.', function (event) {
        if (IPython.notebook.mode == 'command') {
            $('#header').show();
            $('#header-container').toggle();
            $('#maintoolbar').toggle();
            return false;
        }
        return true;
    });

});

【讨论】：

【解决方案4】：

我需要使用小型树莓派 LCD 为 jupyter 4/5 更新这项工作。

从 jupyter 4.x 开始，~/.jupyter/custom/custom.js 中现在需要该脚本

我使用了这个功能，它不仅可以正常隐藏标签，还可以将持久栏移动到可滚动区域。我有没有提到这是在一个微型液晶显示器上？我们需要每一个像素！

define(['base/js/events'], function(events) {
  events.on('app_initialized.NotebookApp', function () {
    $('#header-container').toggle();
    $('.header-bar').toggle();
    $('div#maintoolbar').toggle();
    $('#site').prepend($("#header").detach());
    events.trigger('resize-header.Page');
  });
});

还需要使用~/.jupyter/custom/custom.css消除底部边框

div#notebook{
  padding: 0;
}
div#site{
  height: 100% !important;
}

【讨论】：