在Webkit浏览器中转到这个超简单的小提琴,然后单击输入:

http://jsfiddle.net/eK4TT/

<input type="text">
<input type="text">
<input type="text">
<a href="#">my first link</a>
<a href="#">my second link</a>
<a href="#">my third link</a>

然后,请注意您可以使用Tab键在键盘上浏览输入和链接(和Shift+ Tab以相反的顺序导航).

现在,看看Mac OS上Firefox中的同一个小提琴并做同样的事情.输入获得焦点,但链接不会获得焦点.这不是CSS显示问题.焦点从最后一个输入跳到URL栏.

我tabindex在标记中尝试了无穷无尽的声明组合,但无济于事,例如:

http://jsfiddle.net/eK4TT/1/

到底发生了什么事？我会接受任何答案:

a)在Firefox中工作的小提琴
b)解释Mozilla头脑中究竟发生了什么.它似乎与规范相矛盾.

我已经多次阅读过这方面的文档了,我仍然没有完全理解这些不同命令之间的差异.也许这只是我,但文档可能更清晰:

http://git-scm.com/docs/gitignore

https://help.github.com/articles/ignoring-files

此外,很多关于这个主题的评论似乎使用了"索引","承诺","跟踪"等词语,有些松散,这使得这三者之间的差异不那么明显.

我当前(公认有限)的理解:

• 匹配的文件.gitignore将来不会被跟踪.(虽然它们之前可能已被跟踪过.)这意味着它们将不会在未来的git status列表中显示为已更改. 但是,未来的更改仍将与远程回购同步.换句话说,文件仍然是"索引"的,但它们没有被"跟踪".由于.gitignore文件位于项目目录中,因此可以对文件本身进行版本控制.

• 匹配的文件.git/info/exclude也不会被"跟踪".此外,这些文件永远不会被远程同步,因此永远不会被任何其他用户以任何形式看到.这些文件应该是特定于单个用户的编辑器或工作流的文件.因为它在.git 目录中,所以exclude文件本身不能进行版本控制.

• 已在其上assume-unchanged运行的文件也不会显示在git status或中git diff.这看起来很相似exclude,因为这些文件既没有"索引"也没有"跟踪".但是,之前要提交的文件的最后一个版本assume-unchanged对于repo中的所有用户仍然可见.

我的问题:

1. 以上解释是否正确？请指正.

2. 如果文件已经在提交中,那么在匹配.exclude和运行文件 之间的功能有何不同assume-unchanged？为什么一个人更喜欢另一种方法？

3. 我的基本用例是我想避免在编译文件中对差异进行排序,但我仍然希望这些编译文件与源文件一起同步.将一个gitignore"d文件仍然推？如果没有,如何管理编译文件的最终部署？

在此先感谢您的帮助.

我有这样的标记:

<form name="myForm" ng-controller="myCtrl" novalidate>
    <input ng-model="theValue" type="range" min="0" max="100" required>
    <input ng-model="theValue" type="number" required></input>
    <span ng-show="theValue.$error.number">Hey! No letters, buddy!</span>
</form>

并且我希望在用户意外地在第二个输入中键入字母时显示跨度.简单吧？作为(可能)相关问题,当用户移动第一个滑块输入时,第二个输入中的值消失.为什么？如果我type-number从标记中删除,则不会发生这种情况.

要明确:我希望用户在键入时立即看到工具提示错误,而不进行任何"提交"操作.(form事实上,我根本不需要使用该元素,但所有相关的演示似乎都需要它.)

http://jsfiddle.net/7FfWT/

任何解决方法都是最受欢迎的.如果可能的话,请发一个工作小提琴.

该getScript加入文档说的成功回调:

"一旦脚本加载但未必执行,则会触发回调."

但在我的测试中似乎并不属实.对于包含以下内容的主页:

var startTime = new Date();

$.getScript("test.js")
 .done(function( script, textStatus ) {
    console.log( textStatus );
    console.log( "Done callback executing now.")
  })
  .fail(function( jqxhr, settings, exception ) {
    console.log("error." );
});

加载以下"test.js"脚本,该脚本占用UI 5秒钟:

console.log("ajaxed script starting to execute.");
var newTime = new Date();
while (newTime - startTime < 5000) {
    newTime = new Date();
}
console.log("elapsed time", newTime - startTime);
console.log("ajaxed script finished executing.");

在FF和Chrome中产生相同的可预测控制台输出:

ajaxed script starting to execute.
elapsed time 5000 
ajaxed script finished executing. …

ES6脚本使用let最新Chrome稳定版中的预期运行,如果它在"use strict"定义中.如果使用特殊类型的脚本标记加载它,它在Firefox中运行正常:

<script type="application/javascript;version=1.7" src=""></script>

但是现在这种特殊类型的文件无法在Chrome中运行!在Chrome中,没有脚本运行:无提示失败,无控制台消息.什么是跨浏览器解决方案？(我想知道这是否可以在没有转换的情况下完成.)

我开始使用Rollup和D3版本4,它是用ES2015模块编写的.我使用传统的D3命名空间"d3"编写了一些代码.现在我想使用Rollup创建一个自定义包.我想使用树摇晃,因为我可能只使用了d3中大约一半的功能,我希望尽可能保持光线.

我很清楚我可以有选择地导入函数,例如:

import {scaleLinear} from "d3-scale";
import {
      event,
      select,
      selectAll
} from "d3-selection";

这将变得非常冗长,因为d3的一半是很多功能.我可以忍受这一点.更大的问题是它还需要在没有命名空间的情况下完全重写我的所有函数标识符.我不太关心它,因为我更喜欢命名库代码.

我明白我可以导入所有模块:

import * as d3 from "d3";

它保留了d3对象命名空间,这对我的代码组织很有用.但是,Rollup无法将未使用的功能从树中摇出来.

我梦寐以求的是:

import {
      event,
      select,
      selectAll
} as d3 from "d3-selection";

但是这种特征/语法似乎不存在于规范中.如何有选择地定位模块的各个部分,并在导入期间保留命名空间？

Colorbox似乎非常适合"开箱即用"的响应式设计.我用百分比覆盖默认维度设置,然后设置最大值,以便在大屏幕上不会失控:

$.colorbox.settings.width = "92%";
$.colorbox.settings.height = "90%";
$.colorbox.settings.maxHeight = 850;
$.colorbox.settings.maxWidth = 1200;

这样可行.我也正在调整cboxTitle元素的大小,使其正好在它上面的img的宽度上,这样我的有时冗长的标题总是很好地排列.

$(document).bind('cbox_complete', function(){
    var photoWidth = $(".cboxPhoto").innerWidth();
    var photoContainer = $("#cboxContent").outerWidth();
    var leftPix = (photoContainer - photoWidth) / 2;    
    $("#cboxTitle").css({'left' : leftPix, 'width' : photoWidth});
});

这似乎也有效.这留下了可怕的部分:处理窗口调整大小事件.我正在尝试以下方法

$(window).on("resize", function(){
    $.fn.colorbox.resize({
        height: "90%",
        width: "92%"
    });
});

(我实际上是使用自定义的debouncedresize事件而不是标准的jquery调整大小,以便在Webkit中限制调整大小事件的流,但是我要离开那部分,因为它不相关.而且,我正在重复调整大小选项中相同的宽度和高度百分比值,因为否则不会调整大小.:()

最后一部分根本不起作用.我会尝试解决这些问题:

1)当用户以标准去除大小加载颜色框然后缩小视口范围时,cboxPhoto元素的高度不能正确缩放.宽度正在缩小,但高度保持不变,造成"挤压".所以我尝试添加height:auto到css中cboxPhoto.这恢复了宽高比,但现在cboxPhoto元素太大了,被剪裁了.我以前没有在模态中使用滚动条.如果我关闭彩色框并在新的浏览器视口宽度重新打开它,则照片的大小不会达到.

2)cboxTitle没有重新计算css for .颜色框调整大小功能似乎不会触发cbox_complete事件.不应该吗？

我想解决这些问题,但我也感觉到,考虑到插件的当前状态,解决这个用例的最简单方法是在调整窗口大小时关闭并重新加载整个颜色框,但是回过头来用户在调整大小事件之前查看的库中完全相同的内容.但我还不清楚如何编码.在此先感谢您的帮助!

PS大家,请告诉我,只有设计师才能调整窗口大小.对不起,我只是不买.当屏幕上出现令人惊叹的照片时,人们会向上扩展,而平板电脑尤其会一直旋转......

我正在通过Tavares WebGL教程,陷入困境.

我想使用绘制单个像素GL.points.我的阵列显然有些问题.在FF或Chrome Canary中查看:

http://codepen.io/anon/pen/EPJVjK

/**
 * Creates a program, attaches shaders, links the program.
 * @param {WebGLShader[]} shaders. The shaders to attach.
 */
var createGLProgram = function( gl, shaders ) {
    var program = gl.createProgram();
    for ( var i = 0; i < shaders.length; i += 1 ) {
        gl.attachShader( program, shaders[ i ] );
    }

    gl.linkProgram( program );

    // Check the link status
    var linked = gl.getProgramParameter( program, gl.LINK_STATUS );
    if ( !linked ) …

我有一个d3.custom.build.js这样的文件(简化):

import { range } from 'd3-array';
import { select, selectAll, event } from 'd3-selection';
import { transition } from 'd3-transition';

export default {
    range,
    select,
    selectAll,
    event,
    transition
};

和rollup.config.js这样的:

import nodeResolve from 'rollup-plugin-node-resolve';

export default {
    entry: './js/vendor/d3-custom-build.js',
    dest: './js/vendor/d3-custom-built.js',
    format: 'iife',
    globals: {
        d3: 'd3'
    },
    moduleId: 'd3',
    moduleName: 'd3',
    plugins: [nodeResolve({ jsnext: true })]
};

我想导出一个名为'd3'的普通旧浏览器.我正在从简单的npm脚本调用汇总.好消息是几乎所有东西都在输出文件中工作,除了一件事:d3.event在浏览器中总是为空.不,这不是在页面上被劫持的事件的问题.当我将标准的完整d3 4.0库交换到脚本标记时,一切正常.这绝对是一个构建问题.

该D3文档警告说,捆绑event是棘手:

如果您使用Babel,Webpack或其他ES6到ES5捆绑包,请注意d3.event的值在事件期间会发生变化!导入d3.event必须是实时绑定,因此您可能需要将捆绑程序配置为从D3的ES6模块而不是从生成的UMD包导入; 并非所有捆绑商都观察到jsnext:main.还要注意与window.event全局的冲突.

设置似乎nodeResolve({ jsnext: true })不够.如何在捆绑中获得实时绑定？任何指导非常感谢.

我的网络应用程序具有涉及按住空格键的键盘快捷键。问题是按住空格键时鼠标光标消失。我认为正在发生的事情是浏览器正在尝试向下滚动（即使在我的情况下从来没有任何东西可以向下滚动）。如果用户在按住空格键的同时移动鼠标光标，则光标会在视图中闪烁，只有当鼠标停止移动时才会再次消失。一旦用户释放空格键，鼠标光标将保持隐藏状态，直到再次移动鼠标，之后光标将保持可见。这种情况发生在 Chrome、Safari、Opera (webkit/blink) 中。

在许多事情中，我尝试了preventDefault()on the event 的规范解决方案，无论我在哪里听，它都不起作用。显然，这是可能的，因为我之前使用过的应用程序使用空格键来执行除向下滚动之外的其他操作。

var html = document.documentElement;
var body = document.getElementsByTagName('body')[0];

document.addEventListener("keydown", function(e) {
    console.log("document keydown");
    e.preventDefault();
    e.stopPropagation();
});

window.addEventListener("keydown", function(e) {
    console.log("window keydown");
    e.preventDefault();
    e.stopPropagation();
});

html.addEventListener("keydown", function(e) {
    console.log("html keydown");
    e.preventDefault();
    e.stopPropagation();
});

body.addEventListener("keydown", function(e) {
    console.log("body keydown");
    e.preventDefault();
    e.stopPropagation();
});


document.addEventListener("keypress", function(e) {
    console.log("document keypress");
    e.preventDefault();
    e.stopPropagation();
});

window.addEventListener("keypress", function(e) {
    console.log("window keypress");
    e.preventDefault();
    e.stopPropagation();
});

html.addEventListener("keypress", function(e) {
    console.log("html keypress");
    e.preventDefault();
    e.stopPropagation();
});

body.addEventListener("keypress", function(e) {
    console.log("body keypress");
    e.preventDefault(); …