小编Sea*_*ean的帖子

使flex元素忽略子元素

是否可以使flex元素忽略子元素,因此它的大小不会影响其他元素?

例如,我有一个包装器display: flex.它有标题,内容和页脚.

<div class="wrapper">
    <header></header>
    <article></article>
    <footer></footer>
</div>
Run Code Online (Sandbox Code Playgroud)

我希望包装器忽略标头标签(标头将固定在窗口的顶部).该文章将设置为flex: 1占用其余空间,将页脚强制到页面底部.这是一些示例CSS:

.wrapper {
    display: flex;
    flex-direction: column;
    height: 100%;
    padding-top: 50px; /* Accounts for header */
}

header {
    height: 50px;
    position: fixed;
    top: 0;
    width: 100%;
}

article {
    flex: 1;
}

footer {
    height: 50px;
}
Run Code Online (Sandbox Code Playgroud)

我知道我可以将标题移到包装器之外但是我有很多现有的代码会让它变得更加困难.我甚至可能要问什么?

html css html5 flexbox

32
推荐指数
4
解决办法
3万
查看次数

CentOS上的Node.js imagemin

我试图使用Node.js imagemin压缩我的服务器上的很多图像.我喜欢使用imagemin因为我知道如何将它指向特定的目录.

我正在使用CentOS 6,当我运行我的文件时,我收到错误:

node_modules/imagemin/node_modules/imagemin-pngquant/node_modules/pngquant-bin/vendor/pngquant:/lib64/libc.so.6:未找到版本`GLIBC_2.14'

另外,当我安装了imageminnpm install imagemin,我得到一个错误,上面写着:

错误:pngquant无法构建,请确保已安装libpng-dev

关于我能做些什么来解决这个问题的任何想法?

javascript libpng node.js centos6 imagemin

6
推荐指数
3
解决办法
1万
查看次数

Firefox不会从外部文件打印内联SVG

我无法让Firefox从外部文件打印svg。

我有一个icon.svg文件,其中包含很多不同的图标。我使用以下代码将它们嵌入到页面中:

<svg class="icon icon-sort">
    <use xlink:href="/icons.svg#icon-sort"></use>
</svg>
Run Code Online (Sandbox Code Playgroud)

我的icons.svg看起来像这样:

<svg style="position: absolute; width: 0; height: 0;" width="0" height="0" version="1.1" xmlns="http://www.w3.org/2000/svg">
    <defs>
        <symbol id="icon-sort" viewBox="0 0 1024 1024">
            <title>sort</title>
            <path class="path1" d="M960 432h-896l448-432z"></path>
            <path class="path2" d="M960 592h-896l448 432z"></path>
        </symbol>
    </defs>
</svg>
Run Code Online (Sandbox Code Playgroud)

在Chrome中,一切都可以正常打印;在Firefox中,则为空白。我也正在使用svgxuse polyfill,但是使用和不使用它都有相同的问题。

您可以使用以下链接作为示例,Firefox中没有SVG的打印内容:

https://icomoon.io/svgxuse-demo/

我正在使用Firefox v50。

printing firefox svg inline-svg

6
推荐指数
0
解决办法
610
查看次数

Git Shell中的流星(mingw)

我正在尝试为Meteor JS做教程,但我无法使用Github for Windows附带的Git Shell正常工作.它找不到流星命令.它在cmd中工作,它位于Windows环境路径中.我究竟做错了什么?

javascript mingw path meteor

5
推荐指数
1
解决办法
2062
查看次数

Angular.js从json数据生成csv文件

我试图使用Angular.js从json数据生成一个csv文件.

当我从服务器获取数据时,用户在表中看到它并且可以对数据使用各种过滤器.当用户根据需要过滤它时,我希望他们能够创建csv报告.

而不是将过滤器发送回服务器以生成文件.我想直接从Angular中的过滤数据中完成.

现在,我有这个:

$scope.getReport = ->
      filteredItems = $filter('filter')($scope.records, $scope.query)
      filteredItems = $filter('orderBy')(filteredItems, $scope.tableSort.getOrderProp())

      csvRows = []
      csvRows.push('Title,Assigned ID,Last Name,First Name,Start Date,Complete Date,Page,Test Progress,Certificate')

      csvRows.push("#{record.course.title},#{record.course.assigned_id},#{record.user.last},#{record.user.first},#{record.start_date},#{record.complete_date},#{record.page},#{record.test_progress},#{record.get_cert}") for record in filteredItems
      csvString = csvRows.join("\r\n");

      report = document.createElement('a')
      angular.element(report)
        .attr('href', 'data:application/csv;charset=utf-8,' + encodeURI csvString)
        .attr('download', 'report.csv')
      console.log(report)
      document.body.appendChild(report);
      report.click();
Run Code Online (Sandbox Code Playgroud)

这有点乱,但它似乎适用于Firefox和Chrome.我需要一些可以在IE9 +中运行的东西.

我想的另一种选择,但我无法弄清楚如何使用表单并将json数据发送到服务器.然后,我可以让服务器使用CSV文件进行响应.我的问题是我不知道如何在不使用Ajax的情况下将json数据传送到服务器,而Ajax不会下载返回的文件.

更新

我不认为这是最好的方法,但我使用的是两种解决方案的组合.我有javascript创建如上所述的CSV.然后,当我提交表单时,它会将'csvString'添加为隐藏表单输入的值.数据进入服务器,只响应csv文件.

更新2

再次,这种方法似乎在IE中不起作用......

javascript csv json angularjs

4
推荐指数
1
解决办法
9432
查看次数

带有 CKEditor 的 jQuery 验证插件

我知道以前有人问过这个问题,我已经阅读了所有以前的问题,但我仍然无法让 jQuery 验证器正确验证 CKEditor 字段。

我的表格如下:

<form id="faq-form">
    <p>
        <label>Title:</label>
        <input type="text" id="faq-title" name="faq-title" class="faq-title" />
    </p>
    <p>
        <label for="question">Question:</label>
        <textarea name="question" id="question"></textarea>
    </p>
    <p>
        <label for="answer">Answer:</label>
        <textarea name="answer" id="answer"></textarea>
    </p>            
    <p>
        <input id="submit-faq" name="submit-faq" type="submit" value="Submit" />
    </p>
</form>
Run Code Online (Sandbox Code Playgroud)

两个文本区域都使用以下方法转换为 CKEditor 字段:

<script>
CKEDITOR.replace('question', { toolbar : 'forum' });
CKEDITOR.replace('answer', { toolbar : 'forum' });
</script>
Run Code Online (Sandbox Code Playgroud)

当我尝试验证时,只有标题字段得到验证。我不确定我做错了什么。这是我用于验证的 javascript 代码(以下位于 jQuery 文档就绪函数中)。

$('#faq-form').submit(function() {
    // Update textareas with ckeditor content
    for (var i in CKEDITOR.instances) {
        CKEDITOR.instances[i].updateElement();
        $.trim($('#' + i).val()); …
Run Code Online (Sandbox Code Playgroud)

html javascript forms validation jquery

2
推荐指数
1
解决办法
7916
查看次数