`
aijezdm915
  • 浏览: 400630 次
  • 性别: Icon_minigender_1
  • 来自: 上海
社区版块
存档分类
最新评论

Tilt: Firefox的3D化插件

 
阅读更多

ilt 是一个将页面按照文档树的结构3D化的Firefox插件。它基于WebGL,看起来非常的酷,今年七月当 tilt发布第一个alpha版 的时候,我就被它惊艳的效果吸引了。时隔3月之后,这个插件发布了新的更新,同时Mozilla也发了篇新文章 Debugging and editing webpages in 3D

下面是我的网站在Firefox7下使用tilt的效果,3D效果把整个网页的层次展现的非常直观:

抑或者用线框的样子:

这看起来真的是帅呆了。不过作为一只前端攻城狮,我也一样觉得这玩意恐怕是中看不中用,至少现在是。很难想象我不用firebug而用这么一个花哨 的东西来调试我的页面。最为关键的还是性能问题,我可怜的老机器奔腾双核1.4G+2G+intel x300集显,实在应付不过来- -,卡得就像幻灯片一样…

不过这种层次图的想法真的不错,说不定以后哪天我们的调试工具也能这么酷,至少也能拿来装逼一下不是么?呵呵。

最后提一下安装和使用方法:

  1. 我使用的Firefox7 (6.0应该也可,在往下的版本就不确定了)
  2. addons.mozilla.org 下载安装插件
  3. 打开 Firefox 的 WebGL 支持:
    • 在地址栏输入 about:config 然后回车
    • 确认进入设置修改,搜索 webgl 过滤出相关项
    • 设置 webgl.disabled 为 false
    • 设置 webgl.force-enabled 为 true
  4. 快捷键 Ctrl+Shift+M 启动 Tilt

Enjoy it!

分享到:
评论

相关推荐

    火狐3D插件 Tilt 3D Firefox 3D 视觉化扩展

    在firefox地址栏输入about:config 找到以下内容 devtools.tilt.enabled 设置为true devtools.tilt.force-enabled 设置为true 前提 webgl.disabled 设置为false webgl.force-enabled 设置为true 弄好后重启firefox 按...

    Firefox3D视觉化扩展FirefoxTilt.zip

    Tilt 是一款可以将网页上的元素以 3D 视觉化的方式展现的 Firefox 扩展。 Tilt 会按照 DOM 的树形结构,将网页中的元素以 3D 方式呈现出来,使网页开发者可以更加直观的分析网页结构关系。 Tilt 使用 WebGL 进行...

    3D-react-tilt.zip

    3D-react-tilt.zip,react js-tilt.js的视差倾斜悬停效果,3D建模使用专门的软件来创建物理对象的数字模型。它是3D计算机图形的一个方面,用于视频游戏,3D打印和VR,以及其他应用程序。

    firefox 11.0b2 for linux

    Firefox 11.0 更新的部分内容: • 允许从 Google Chrome 浏览器汇入书签、历史记录和 ...• 整合原先的 Tilt 扩展,提供 3D 化的页面元素分析。 • 增加了对 SPDY 协议的支持。 • 允许在 IndexedDB 中存储档。

    欧拉公式求圆周率的matlab代码-Full-Tilt:全倾斜

    Tilt为开发人员提供了三个互补的设备方向传感器输出表示形式-屏幕调整后的四元数,旋转矩阵和欧拉角-可用于在可在所有移动Web平台和所有屏幕方向上一致工作的Web浏览器中创建2D或3D体验。 。 该库还提供了在不同设备...

    firefox扩展(3.6)

    firefox扩展(3.6) firefox扩展(3.6) firefox扩展(3.6)

    leetcode不会-leet-binary-tree-tilt:leet二叉树倾斜

    Tilt of node 2 : 0 Tilt of node 3 : 0 Tilt of node 1 : |2-3| = 1 Tilt of binary tree : 0 + 0 + 1 = 1 笔记: 任何子树中节点值的总和都不会超过 32 位整数的范围。 所有倾斜值都不会超过 32 位整数的范围。

    OpenMV-Pan-Tilt:OpenMV平移机器人

    OpenMV泛倾斜OpenMV平移机器人你需要: OpenMV 3D打印机零件(倾斜/ stl) 锚板(云台/鹰)

    arduino_pan_tilt:节点控制的 arduino Pan Tilt 装备

    arduino_pan_tilt 节点控制的arduino Pan Tilt rig,由leapmotion控制但不限于。 使用约翰尼五号建造。 事情工作的视频。

    火狐浏览器2.6(自带中文调试插件)

    延伸了火狐同步的功能用户可以在不同计算机之间来同步...Mozilla基金会是一个非营利性开源软件机构,旗下谋智网络是Mozilla的中国子公司,目前负责在中国运营 Firefox 火狐浏览器以及Firefox Mobile 移动浏览器产品。

    tilt-feedstock:一个用于倾斜的conda-smithy仓库

    Tilt可以自动执行从代码更改到新过程的所有步骤:监视文件,构建容器映像并更新环境。 当前构建状态 蔚蓝 变体 状态 linux_64 osx_64 win_64 当前发行信息 姓名 资料下载 版本 平台类 安装倾斜 通过使用以下方法...

    tilt:使用Web Audio实时编码Waveshaper

    倾斜受字节跳动启发的实时编码事物,用于波动合成。 使用WebAudio API在现代浏览器上运行。用法要产生声音,请定义变量o的值。 它必须是0到1之间的数字。为此,可以使用t参数,该参数始终递增。...

    tilt:最重要的后端,为交易者提供了本机的React

    倾斜客户Tilt React本机应用程序

    好好的火狐插件可以调试JavaScript

    好好的火狐插件,非常好的,呵呵,大家下载吧,哈哈哦,好的很,可以调试JavaScript

    tilt:s模拟对HTML元素的触摸反馈

    倾斜 一个2 kB,无依赖的微型脚本,用于模拟HTML元素上的触摸反馈。

    Tilt:倾斜-使用陀螺仪在Javascript中移动元素!

    倾斜 倾斜-使用陀螺仪在Javascript中移动元素! 可能需要在移动设备上才能观看演示。 演示: : 倾斜您的设备以查看图片从左到右,上下移动! 我在解释它的工作方面做得很糟糕。 考虑一下iOS 7和8;...

    react-tilty:Tilt.js jQuery插件的端口,基于tilt.js原始版本

    React性 一个阵营的端口的版本 “一个微小的requestAnimationFrame为React提供了60 + fps的轻量视差悬停倾斜效果” 查看一个简单的演示 要求 这个包在内部使用钩子,因此它需要React版本16.8或更高版本。...

    leetcode不会-LeetCode_563--Binary-Tree-Tilt:LeetCode_563--二叉树倾斜

    leetcode 不会LeetCode_563--二叉树倾斜 给定一棵二叉树,返回整棵树的倾斜度。 树节点的倾斜度定义为所有左子树节点值的总和与所有右子树节点值的总和之间的绝对差。 空节点的倾斜度为 0。 整棵树的倾斜度定义为...

Global site tag (gtag.js) - Google Analytics