小编bre*_*ine的帖子

是否有水平表布局的CSS替代方案没有缺点?

我的老板要我停止使用CSS布局并开始使用表格布局.其中一个主要因素是表格在水平定位的流体布局中的理想行为.看这个例子:

如果您将HTML面板的宽度滑动得更窄,您将看到该表(第一个)具有以下几个方便的特性:

  1. 自动找到拆分两个单元格的好地方,为单元格提供更多内容可用宽度的更大百分比.
  2. 填充所有可用宽度100%.
  3. 在决定要包装哪个单元时,它以最有效的垂直空间方式进行.
  4. 无论如何,保持两个单元水平对齐.

示例A没有质量1.(如果内容大小发生变化,您必须手动更新比率.)

例B没有质量1或3.(静态50%不太理想,但可以工作.但是,当桌子仍然只有2行高时它会断开3行.)

示例C没有质量2或4.(我可以看到用这个假冒质量2的方法,但是清理到下一行完全是一个交易破坏者.)

示例D没有质量1或4.(从技术上讲,它有1,但两者之间的巨大差距是不实际的.另外,在同一行上左/右浮动在某些浏览器中不能正常工作.)

由于数据不是语义表格,我真的想避免使用表格.但是我的老板付钱给我,所以我需要按照他的说法去寻找更好的解决方案.有没有办法使用语义标记和CSS来做到这一点?

css semantic-markup

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

使用Javascript读取CSS文件并动态更改页面

所以CSS @media查询在IE8中不起作用.

@media (min-width: 768px) {
/* some css */
}
@media (min-width: 972px) and (max-width: 1024px){
/* different css */
}
Run Code Online (Sandbox Code Playgroud)

现在,我可以创建单独的CSS文件命名IE_min768.css,IE_min972_max1024并在调整页面宽度时使用Javascript动态加载和卸载文件.但这违反了DRY,并且在多个地方维护CSS会很痛苦.

是否可以使用Javascript(仅在IE中)实际读取CSS文件,检测@media部分并在正确的情况下动态地将CSS应用于浏览器?

javascript css responsive-design

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

为什么jquery:not()选择器不像我期望的那样工作?

我正在尝试设置一个事件,当.four点击任何没有类的东西时触发.但是,.four即使我正在使用,它也会在点击类的内容时触发e.stopPropagation().

$("html").one("click", ":not(.four)", function(e){
   e.stopPropagation();
   console.log("Something without class 'four' was clicked that had class: " + $(e.srcElement).attr("class") );
});
Run Code Online (Sandbox Code Playgroud)

(jsFiddle演示)

这也不起作用:

$("html").not('.four').on("click", function(e){
Run Code Online (Sandbox Code Playgroud)

两个输出: Something without class 'four' was clicked that had class: four

我遇到:not()了很多麻烦,我怀疑它可能与我:not()现在支持CSS3的浏览器有很大关系,但我仍然无法理解这个简单的问题.

javascript jquery css3

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

有没有替代使用contenteditable或textarea?

我正在使用在线富文本编辑器,类似于WordPress页面创建者或Stack Overflow后创建者.有人指出,有两种不同类型的在线富文本编辑器:

  1. WYSIWYG编辑,和
  2. HTML编辑器

我正在构建第二种类型.不幸的是,<textarea>也没有使用contenteditable是HTML富文本编辑非常方便.

这个问题<textarea>(如在这里堆栈溢出使用)是你不能显示文本级语义在编辑栏.您不能只突出显示一个单词并使其变为粗体,您必须插入某种标记(例如*****bold*****).不是非常用户友好,也不是真正的"丰富"文本.

另一方面,使用contenteditable解决了这些问题但引入了控制问题.浏览器将插入各种HTML和CSS以使编辑字段看起来很好.如果你点击Enter,浏览器将插入<p>,或<div>,或<br>,或<div><br></div>...取决于浏览器.如果您粘贴从HTML复制的几个段落,您会得到大量过多的标记 - 甚至超过源HTML中的标记.例如,以下源代码:

<p>This is one paragraph!</p>
<p>This is another.</p>
Run Code Online (Sandbox Code Playgroud)

在网站上显示为:

This is one paragraph!

This is another.
Run Code Online (Sandbox Code Playgroud)

...如果你复制并粘贴到contenteditable表格中,可以给你这样的东西:

<p style="line-height: 1em; color: rgb(34, 34, 34); font-size: 12px; 
white-space: normal;">This is one paragraph!</p>
<p style="line-height: 1em; color: rgb(34, 34, 34); font-size: 12px; 
white-space: normal;">This is another.</p>
Run Code Online (Sandbox Code Playgroud)

...带来内联样式,在某些情况下还有其他HTML.

我一直试图弄清楚 …

wysiwyg richedit contenteditable rich-text-editor richeditabletext

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

如何使用无限循环恢复JSFiddle中未保存的JS更改?

我不小心在JSFiddle中创建了一个无限循环,因此页面没有响应.我有一段时间没有保存,所以我不想重新加载并丢失更改.我正在使用Chrome,但已经过了二十分钟,Chrome还没有抓住循环并让我有机会结束剧本.

我确实打开了开发人员控制台,但响应速度不是很快.Chrome是否在硬盘上的某个地方有我的代码的本地副本?

javascript infinite-loop browser-cache jsfiddle

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

如果鼠标移动太快,则使用 mousemove 处理程序拖动元素会停止跟踪

我已经设置了一个mousemove处理程序来拖动元素。但是,如果您移动光标太快,它就会失去对该元素的跟踪,并且不会再移动它,直到您将光标重新移到该元素上。

这是一个 JSFiddle演示。

为什么要这样做?

 $this.on("mousemove.partmove touchmove", function(e){
     e.preventDefault();
     var moveL = e.clientX; 
     var moveT = e.clientY;
     console.log("mov " + (moveT-vOffset) );
     $this.css({"left": moveL-hOffset, "top": moveT-vOffset});
 });
Run Code Online (Sandbox Code Playgroud)

javascript jquery handler mousemove jquery-events

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

无法在'DedicatedWorkerGlobalScope'上执行'postMessage':提供的值无法转换为序列

我收到以下错误

未捕获的TypeError:无法在'DedicatedWorkerGlobalScope'上执行'postMessage':提供的值无法转换为序列.

在网络工作者的这一行:

postMessage("hi", "http://localhost:8000");
Run Code Online (Sandbox Code Playgroud)

(事实上​​,这就是整个网络工作者).

基本文件包含:

var myWorker = new Worker("test.js");
myWorker.onmessage = function (e) {
    console.log('Message received from worker');
};
Run Code Online (Sandbox Code Playgroud)

我不确定它抱怨哪个值,我不确定将它转换为"序列"意味着什么.

web-worker

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

打开 RewriteEngine 会产生 403 错误——如何打开 FollowSymLinks?

我正在 OSX 上使用内置的 Apache2。我将文档根目录移动到桌面上的一个文件夹中,并确保它_www具有everyone读取权限。它工作得很好,很棒,PHP 工作,一切工作正常,直到我.htaccess仅添加以下行:

RewriteEngine on
Run Code Online (Sandbox Code Playgroud)

一旦我这样做,包含该文件的目录中的所有内容都是 403 Forbidden:

Forbidden
You don't have permission to access /dir/file.txt on this server. 
Run Code Online (Sandbox Code Playgroud)

Apache 日志显示此错误:

[错误] [客户端 127.0.0.1] 选项FollowSymLinksSymLinksIfOwnerMatch已关闭,这意味着禁止RewriteRule指令:/Users/uname/Desktop/localhost/dir/filename.txt

我已经检查过httpd.conf并确保我已启用FollowSymLinks但无济于事:

DocumentRoot "/Users/uname/Desktop/localhost"
<Directory />
    Options FollowSymLinks
    Options SymLinksIfOwnerMatch 
    AllowOverride All
    Order allow,deny
    Allow from all
</Directory>

<Directory "/Users/uname/Desktop/localhost">
    Options FollowSymLinks
    Options SymLinksIfOwnerMatch 
    Options Indexes MultiViews
    AllowOverride All
    Order allow,deny
    Allow from all
</Directory>
Run Code Online (Sandbox Code Playgroud)

RewriteEngine on如果我在文件中注释掉.htaccess …

apache mod-rewrite symlink apache2 httpd.conf

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

GitHub 工作流程:每个开发人员都应该有自己的分支吗?

我们的团队是第一次使用 GitHub。我们设置它以便我们可以将其用作pull requests进行代码审查的一种方式。

  1. 有一个每个人都有权参与的团体组织,其中包含规范的存储库。
  2. 每个开发人员都会forked存储组存储库并将更改推送到他们的fork.
  3. 开发人员准备好后向组存储库提交pull request,然后另一位开发人员审查代码,然后将pulls其放入。

这是一个合理的工作流程吗?我担心的是,当组存储库更新时,分叉存储库不会自动更新。如果每个人都直接为小组回购做出贡献会更好吗?如果是的话,有没有办法使用GitHub方便进行代码审查?

git github

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

Javascript检测是否安装了Adobe Reader

我们有一些PDF表单无法在非Adobe PDF阅读器正确显示(即WebKit的内置PDF阅读器无法正确显示某些专有的Adobe内容).我们希望检测用户何时没有安装Adobe的 PDF阅读器,并给他们一些警告,但我很难在2014年搞清楚如何做到这一点.

看起来这个脚本在2011年工作.基本上它循环navigator.plugins并查找名称Adobe Acrobat或插件的插件Chrome PDF Viewer.

 for(key in navigator.plugins) {
      var plugin = navigator.plugins[key];
      if(plugin.name == "Adobe Acrobat") return plugin;
 }
Run Code Online (Sandbox Code Playgroud)

闪存到今天,Adobe必须改变一些东西,因为我安装了Adobe Acrobat,但它似乎没有navigator.plugins!它现在在哪里,我如何检测它?

javascript pdf adobe acrobat browser-plugin

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