标签: blink

自10.7(Mac OS X Lion)以来MacOS上的WebKit/Blink(Safari/Chrome)默认行为是在不使用触控板用户时隐藏滚动条.这可能令人困惑 ; 滚动条通常是元素可滚动的唯一视觉提示.

示例(jsfiddle)

<div class="frame">
    Foo<br />
    Bar<br />
    Baz<br />
    Help I'm trapped in an HTML factory! 
</div>

.frame {
    overflow-y: auto;
    border: 1px solid black;
    height: 3em;
    width: 10em;
    line-height: 1em;
}?

如何强制滚动条始终显示在WebKit中的可滚动元素上？

我真的想让一段文字在不使用javascript或文本装饰的情况下使老式风格闪烁.

没有过渡,只有*闪烁*,*闪烁*,*闪烁*!

编辑:这与那个问题不同,因为我要求在没有连续转换的情况下闪烁,而其他问题的OP询问如何用连续转换替换闪烁

在流血和流泪之后,我终于设法建立了一个Node C++插件,并将一个Web平台标准MediaStream对象推送到其C++方法之一.为了兼容不同的V8和Node.js版本,我使用Native Abstractions for Node.js(nan):

addon.cc

NAN_METHOD(SetStream)
{
    Nan::HandleScope scope;
    v8::Local<v8::Object> mediaStream = info[0]->ToObject();
}

addon.js

setStream(new MediaStream());

对于它的价值,它可以正常工作(即它不会立即删除渲染器进程),并且我可以验证MediaStream对象的存在,例如通过从C++方法返回其构造函数名称:

addon.cc

info.GetReturnValue().Set(mediaStream->GetConstructorName());

当从JavaScript调用时setStream,这将返回字符串MediaStream,因此对象肯定存在.我也可以返回mediaStream对象本身,一切都会正常工作,所以它确实是我需要的对象.

那么,我如何MediaStream在C++中从这个对象中读取音频数据(即音频样本)？作为旁注,实际数据读取(和处理)将在单独的情况下完成std::thread.

赏金更新

我明白如果我自己编译Electron和/或Chromium,这将更容易/可能,但我宁愿不参与维护地狱.

我想知道如果没有这样做是否可能,并且就我的研究而言,我确信我需要做两件事:

1. 我相信blink public的相关头文件应该足够了
2. 铬/闪烁库文件(？),用于解析外部符号,类似于node.dylib文件

另外,正如我所说,我相信我可以自己编译chrome/blink然后我会有这个lib文件,但这对于Electron来说是一个维护地狱.考虑到这一点,我相信这个问题最终归结为C++链接问题.有什么其他方法可以做我正在寻找的东西吗？

编辑

在我的情况下,ScriptProcessorNode不是一个选项,因为它的性能使它在生产中几乎无法使用.这将需要在ui /主线程上处理音频样本,这绝对是疯狂的.

我遇到了一个有趣的错误(？),如果您使用<use>作为链接的一部分(例如图标)嵌入SVG - 图标本身不会在jQuery中注册click事件,但单击文本会.我认为这是由于SVG事件没有冒泡？

如果直接嵌入SVG,无论是否单击文本或图标,链接都会触发.

我在这里可以看到一个简单的测试用例: SVG <use> bug测试用例.

当我使用CSS滤镜,阴影,变换,SVG(或类似)时,我的Chrome/Chromium会显示一条奇怪的对角线:

    filter:drop-shadow(0px 0px 10px #dce810);
    transform:skew(-15deg); 

Firefox(Windows)/ Canary Chrome 58中没有错误.Chrome 56和Chromium 58(Windows)出错.

在这支笔中,发生了这个错误(最后,当打开标题时):https://codepen.io/manz/pen/jyYKJo

有没有人知道这是一个已知的错误或通过禁用任何选项解决的一些问题？

我blink在我的应用程序中使用以显示错误消息.问题是它在Firefox中工作但在Chrome中不起作用.我不知道问题是什么.如何让它在Chrome中运行？

我的Web应用程序上有一个按钮,它在click事件处理程序中包含以下代码:

const fileInputEl = document.createElement('input');
fileInputEl.type = 'file';
fileInputEl.accept = 'image/*';

fileInputEl.addEventListener('input', (e) => {
  if (!e.target.files.length) {
    return;
  }

  // Handle files here...
});  

fileInputEl.dispatchEvent(new MouseEvent('click'));

有时(大约8分之一),在选择文件后,选择文件后input事件不会触发.我猜这是围绕元素生命周期的浏览器错误.

有什么方法可以将元素附加到页面并稍后删除它？现在在现代浏览器中处理这个问题的正确方法是什么？

我在Windows上使用Google Chrome进行测试.

JSFiddle:http: //jsfiddle.net/pja1d5om/2/

我在下面有这段代码:

echo " \033[33mTitle of the Program\033[0m"

它将颜色变为黄色.

如何使文本"程序的标题"闪烁？

TLDR：我正在尝试确定是否值得花一些时间掌握SMIL。官方路线（至少来自 Blink，但可能不是来自 Gecko）似乎是这种动画技术在功能上已被弃用……但实际情况表明情况并非如此。

我想学习 SMIL，因为它让我觉得它是一种优雅的技术——但我不想今年花几个月的时间学习一两年后就会过时的东西。

问题： 值得学习SMIL吗？

几年前，人们一致认为SVG的动画语言SMIL（同步多媒体集成语言）将被弃用：

2015 年 4 月，Blink团队写道：

“我们打算弃用 SMIL 动画以支持 CSS 动画和 Web 动画”

资料来源： https : //groups.google.com/a/chromium.org/g/blink-dev/c/5o0yiO440LM）

五年半前有意弃用的两个主要原因似乎是：

• “在实现方面，SMIL 为 Blink 增加了显着的复杂性”
• “Internet Explorer 不支持 SMIL，这限制了它对关键功能的使用”

滚动到 2020 年，Internet Explorer迷失在时间的迷雾中，MSIE 的继任者Edge现在使用Blink渲染引擎（以及Chromium、Chrome、Opera、Brave等）。

眨眼的主要竞争对手，壁虎，也似乎完全满意SMIL …

互联网上有很多SO问题和博客试图解释虚拟dom是什么,但这个问题是为什么这种优化必须在JavaScript /作为框架的一部分而不是由浏览器本身实现.

据我所知,虚拟DOM是一个由Javascript对象组成的树,父母/子女等,但没有真正DOM的大部分"重"特征.框架(例如React/Vue)通过从头开始创建虚拟DOM来响应模型状态的变化,然后在其虚拟DOM的最后一个版本上执行差异以找出要更改的真实DOM.

我读过的许多内容都声称虚拟DOM更快,因为真正的DOM每次发生变化时都必须重新布局(甚至重新绘制),但事实并非如此 - 只有当需要重新布局时才需要重新布局某些JS代码明确要求某些样式/文本流相关值(例如高度/宽度等).并且可能大多数使用虚拟DOM的框架在这​​方面做得不够好 - 除了确保开发人员不会意外地做到这一点.

此外,最近在某些时候浏览器正在考虑为DOM变异提供事件挂钩,但是这个想法已被放弃,这意味着不应该在DOM被突变的点上触发任何事件.

所以我的问题是,这会带来什么好处呢？JS框架有哪些额外的信息或额外的自由,使其具有执行虚拟DOM优化的"逻辑"能力？