Tag: 浏览器的WebKit

iPhone的WebKit CSSanimation会导致闪烁

这是iPhone的网站: http : //www.thevisionairegroup.com/projects/accessorizer/site/ 点击“立即游戏”后,您将进入游戏。 枪会滚动。您可以上下滚动钱包和配件。 你可以看到,当你放开它们时,它们会卡入到位。 就在这个瞬间发生时,就会出现闪烁。 我使用的唯一的webkitanimation是: '-webkit-transition': 'none' '-webkit-transition': 'all 0.2s ease-out' '-webkit-transform': 'translate(XXpx, XXpx)' 我根据是否需要animation来select第一个或第二个转换,而转换是我移动的唯一方法。 最大的问题是,当你点击“匹配项目”,然后点击“再次播放”。 你会看到,作为枪的animation,整个背景的配件/钱包变白。 有人可以请我散发一些洞察力为什么这是发生?

跆拳道是跆拳道? (在WebKit代码库中)

我下载了Chromium的代码库并运行了WTF命名空间 。 namespace WTF { /* * C++'s idea of a reinterpret_cast lacks sufficient cojones. */ template<typename TO, typename FROM> TO bitwise_cast(FROM in) { COMPILE_ASSERT(sizeof(TO) == sizeof(FROM), WTF_wtf_reinterpret_cast_sizeof_types_is_equal); union { FROM from; TO to; } u; u.from = in; return u.to; } } // namespace WTF 这是否意味着我认为的意思? 可能是这样,如果TO或FROM不是POD ,并且不是(AFAIK)比reinterpret_cast内置的C ++更强大的话,那么这里指定的bitwise_cast实现将不会被编译。 我在这里看到的唯一亮点就是没有人在Chromium项目中使用bitwise_cast 。

从检查器(webkit,firebug等)导出CSS更改

当我使用CSS时,我会经常在浏览器中进行testing – 比如说Chrome – 右击一个元素,点击Inspect Element,然后在那里编辑CSS。 使用箭头键来改变诸如边距和填充之类的东西,使得排列起来非常容易。 将这些修改应用到CSS文件并不难,但是如果我可以右键单击检查器中的select器并select“导出”或“复制”,并且可以获得我的内容剪贴板。 有这样的事情吗?

<ul>中的<li>元素的自定义项目符号是常规字符,而不是图像

我意识到可以使用CSS属性指定一个自定义graphics作为替代项目符号字符: list-style-image 然后给它一个URL。 但是,就我而言,我只是想使用“+”符号。 我不想为此创build一个graphics,然后指向它。 我宁愿只是指示无序列表使用加号作为项目符号。 可以这样做,还是我不得不把它做成一个graphics?

webkit转换translate3d后,css z-index丢失了

我有两个绝对定位的div元素重叠。 两者都通过css设置了z-index值。 我使用translate3d webkit转换来将这些元素从屏幕上移开,然后返回到屏幕上。 变换之后,元素不再尊重它们的z-index值。 任何人都可以解释一旦我做了一个webkit转换的div元素z-index /堆栈顺序会发生什么? 并解释我能做些什么来保持div元素的堆栈顺序? 以下是关于我如何进行转换的更多信息。 在转换之前,每个元素都通过css获取这两个webkit转换值(我使用jQuery来执行.css()函数调用: element.css({ '-webkit-transition-duration': duration + 's' }); element.css({ '-webkit-transition-property': '-webkit-transform' }); 然后使用translate3d -webkit-transform对元素进行animation处理: element.css({ '-webkit-transform': 'translate3d(' + hwDelta + 'px, 0, -1px)' }); 顺便说一句,我已经尝试将translate3d的第三个参数设置为几个不同的值来尝试复制三维空间中的堆栈顺序,但没有运气。 此外,iPhone / iPad和Android浏览器是我的目标浏览器,这个代码需要运行。 两者都支持webkit转换。

如何做一个webkit的CSS无尽的旋转animation。

我想通过CSS旋转我的加载图标。 我有一个图标和下面的代码: <style> #test { width: 32px; height: 32px; background: url('refresh.png'); } .rotating { -webkit-transform: rotate(360deg); -webkit-transition-duration: 1s; -webkit-transition-delay: now; -webkit-animation-timing-function: linear; -webkit-animation-iteration-count: infinite; } </style> <div id='test' class='rotating'></div> 但它不起作用。 如何使用CSS旋转图标?

在Safari中隐藏textarea调整句柄

我在我的应用程序中使用textarea组件,并且我dynamic地控制它们的高度。 当用户键入时,只要有足够的文本,高度就会增加。 这在IE,Firefox和Safari上运行良好。 但是,在Safari中,右下方有一个“句柄”工具,允许用户通过点击和拖动来调整textarea的大小。 我也注意到这个问题与textarea在stackoverflow问一个问题页面。 这个工具令人困惑,基本上是阻碍。 那么,是否有隐藏这个resize的句柄? (我不确定“处理”是否正确,但我想不出一个更好的术语。)

Chrome / jQuery未捕获RangeError:超出最大调用堆栈大小

我在chrome上收到错误“Uncaught RangeError:Maximum call stack size exceeded”。 这里是我的jQueryfunction $('td').click(function () { if ($(this).context.id != null && $(this).context.id != '') { foo($('#docId').val(), $(this).attr('id')); } return false; }); 请注意,页面中有成千上万的单元格。 但是,我通常会将堆栈溢出与recursion联系起来,在这种情况下,就我所见,没有任何溢出。 像这样创build一个lambda会自动生成堆栈上的东西的负载? 有什么办法吗? 目前唯一的解决方法是在渲染HTML时在每个单元格上明确地生成onclick事件,这使HTML变得更大。

从Chrome / Webkit的<select>元素中移除圆angular

Chrome的用户代理样式表给5个边距半径的<select>元素的所有angular落。 我已经尝试通过我的外部样式表应用半径为0px,以及内联元素本身; 我已经尝试了border-radius:0px和-webkit-border-radius:0px; 我试过了更具体的border-top-left-radius:0px (和它的-webkit相同)。 没有任何工作。 当我检查webkit的开发人员工具中的元素时,“计算样式”仍将半径列为5px。 但是,如果我点击它旁边的扩展箭头查看具体信息,它将显示:element.style – 0px。 在下面,它显示了我给出的0px的外部CSS规范,以及5px的用户代理样式表规范。 而后两者都是他们应该去掉的。 有任何想法吗?

CSS什么是-moz-和-webkit-?

-webkit-column-count: 3; -webkit-column-gap: 10px; -webkit-column-fill: auto; -moz-column-count: 3; -moz-column-gap: 10px; -moz-column-fill: auto; 我是一个在CSS初学者,当我有一天在看一些CSS代码,我发现这些线。 在我用来学习CSS的教程中,我从来没有见过类似这些行的东西。 有人可以向我解释这些行或给我一个来源,我可以学习实现这样的线? 提前致谢!