跳至主要内容
CSS-Tricks
  • 文章
  • 笔记
  • 链接
  • 指南
  • 年鉴
  • 随机
搜索

Links

来自网络各处的文章,我们正在阅读并思考。有没有我们应该知道的链接?告诉我们!

博客仍然很棒,你的博客也可以很厉害

🔗 http://panelpicker.sxsw.com/ideas/view/5801
阅读评论

这是我为 SXSW 提出的演讲的标题。我对此非常兴奋。我将重点谈论这个博客以及多年来我如何做事的,以及哪些方法对我成功或不成功(我之前从未真正谈论过这些)。然后,如何利用这些想法来改进你自己的博客。我保证这不会是一堆你听过无数遍的关于内容为王的废话。

在移动 Safari 中触摸“滑动解锁”

🔗 http://www.evanblack.com/blog/touch-slide-to-unlock/
阅读评论

Evan Black 采用了我的“滑动解锁”演示,并使用 JavaScript 触摸事件使实际的指尖滑块在移动 Safari 中工作。我还更新了此站点上的演示,使其同时在桌面浏览器和移动 Safari 中工作。

Safari 5 的 BetterSource

🔗 http://www.awarepixel.com/safari/bettersource/
阅读评论

Safari 的主要缺点之一是“查看源代码”视图非常糟糕。没有代码高亮显示,没有实时链接,没有行号,也没有刷新。太糟糕了。BetterSource 扩展解决了所有这些问题。我确实希望有一个选项可以在标题栏中仅显示其中一个按钮或另一个按钮(一个用于原始源代码,一个用于生成的源代码),我不需要两者。更新:您可以右键单击标题栏并拖出不需要的那个。

Wufoo API 竞赛

🔗 http://wufoo.com/apicontest/
阅读评论

我们将向 Wufoo API 竞赛的获胜者赠送一把战斧(以及 3000 美元)。第二名和第三名获胜者也将获得现金奖励和终身 Wufoo 账户。开发者们,你们还有一个月的时间!查看页面以获取想法和 API 包装器。

CSS 选择器的性能

🔗 http://screwlewse.com/2010/08/different-css-techniques-and-their-performance/
阅读评论

这里的想法是比较不同的 CSS 编写风格,并查看它们如何影响页面渲染。因此,使用所有 ID、使用所有类、使用 OOCSS 技术等。我之前在最佳实践建议中提供了一些建议,但没有测试来支持任何内容。因此,对我来说,最有趣的部分是如何衡量测试。测试想法来自Jon Sykes 的文章,他在文章中写道

在 HTML 的最顶部,我将使用 Javascript 创建一个时间戳,这是所有内容的开始计时器。然后,我将在 setInterval 上设置一个函数,以便它循环,该函数使用 getElementById 检查一个 dom 元素,它检查该节点是否存在,如果存在,它会检查该节点是否应用了样式,如果应用了样式,它会触发一个新的时间戳标记开始和结束之间的差异,然后将其写出。

结果表明,与分别声明每个选择器及其属性和值相比,OOCSS 的速度快得多。甚至快到明显的速度差异。此外,Opera 最快,Firefox 最慢(未测试 IE)。但这是完美的测试吗?拥有所有重复的属性和值是否会增加 CSS 的大小,也许这就是它速度较慢的原因?据我所知,很难仅测试选择器的速度。

跨浏览器 HTML5 视频和音频

🔗 http://mediaelementjs.com/
阅读评论

MediaElement.js 是一个基于 jQuery 的包,允许我们

  1. 使用 HTML5 元素 <video> 和 <audio> 并使其跨浏览器工作(包括移动 WebKit)
  2. 为控件提供一致的 UI
  3. 仅使用单一格式

我将把它用于此站点的重新设计。我已准备好直接说我正在使用 HTML5 视频,如果您的浏览器不支持该视频,则直接下载并使用VLC 或其他工具。但后来我意识到我必须重新编码以至少包含 OGG,而对于 90 个视频来说,这真的不吸引我。此外,我当时正在尝试使视频宽度灵活,但这进展不顺利(另一个故事),所以我放弃了。现在我们有了这个,事情就搞定了!Firefox/Opera/IE<8 将回退到 Silverlight 播放器,而 WebKit 浏览器(最终还有 IE 9)将使用原生 HTML5。我听说过的一个问题是,即使使用 Chrome/Safari(原生支持带有 H.264 的 HTML5)访问使用此功能的网站,也可能会提示您安装或更新 Silverlight,这有点糟糕。显然我已经安装了最新版本,因此无法确认这一点。

Quick Hits

# 2024 年 8 月 23 日
# 2024 年 8 月 21 日
# 2024 年 8 月 14 日
# 2024 年 8 月 14 日
更多快速提示 →
  • 更新
  • 1
  • ...
  • 196
  • 197
  • 198
  • ...
  • 219
  • 较旧

CSS-Tricks 由 DigitalOcean 提供支持。

关注网络开发最新动态

使用我们精心制作的时事通讯

DigitalOcean
  • 关于 DO
  • Cloudways
  • 法律信息
  • 获取免费积分!
CSS-Tricks
  • 为我们撰稿!
  • 与我们合作广告
  • 联系我们
社交
  • RSS Feed
  • CodePen
  • Mastodon
  • X
返回顶部

© 2024 . All rights reserved.