仅显示以下 2 篇带「位置」关键字的文章。 返回词云 或 查看全部文章
2011-07-16 by Dron
最近断断续续地写出了这么个东西：http://ucren.com/demos/d3d/index.html。
这是一个简单的 JS 3D 模型，能跑在包括 IE6 的所有浏览器上，结合一下 tween 缓动算法，理论上已经可以完美模拟像 http://www.cu3ox.com/ 这个网站上方 banner 的各种变换效果了。
介绍一下实现细节，矢量绘图仍然用的是 Raphael 库，Raphael 我在《如何用 JS 实现 3D 赛车效果》这篇文章里有过介绍。此外，我参考了大量关于三维透视的文章，在下面的一些实现上用到了很多相关知识。
我们通常用一根带原点和正方向箭头的直线来表示数轴，数轴就是一个一维坐标系，两条在原点处相交并互相垂直的数轴就形成了二维坐标系，也叫平面直角坐标系，它用两个参数 x,y 来表示平面上一个点的位置，在平面直角坐标系上，加入一条经过原点且垂直于该平面的数轴就形成了三维坐标系，它用三个参数 x,y,z 来表示空间中一个点的位置。三维坐标系分为 左手坐标系 和 [右手坐标系] (http://baike.baidu.com/view/2939423.htm)两种，为了实现的方便，本例采用左手坐标系做为场景。
2011-06-26 by Dron
网页上，为了方便用户及时看到有价值的信息，通常会采用自动滚屏的交互效果，使变化的信息在第一时间呈现。
滚屏的实现，普遍做法是改变网页根节点的 scrollTop 和 scrollLeft 属性，就像这样：
document.documentElement.scrollTop = 500; // 滚动到 500px 的位置
scrollTop 和 scrollLeft 属性接受一个数值，需要涉及到元素位置的计算（记得那个复杂的位置计算的算法么？），对于需要滚动至某个元素可见，scrollTop 和 scrollLeft 不见得是最优的方案，其实，除了这种办法，我们还可以有以下两种办法来达到滚动的目的。
地址栏中 # 号后面的字符串叫做 hash，浏览器在网页打开完成后或者在 hash 值改变时，会自动滚屏至名称与 hash 值相等的锚点元素位置上，利用这个特性，我们可以在需要的位置插入锚名，然后通过改变 location.hash 的值来达到滚屏效果，具体写法这里就不细说了。
这种方案有一定缺陷，在某些浏览器下，hash 值的改变会产生浏览历史记录，导致对历史记录的破坏，影响用户使用前进后退功能；而且，在一些网页里，hash 值可能会有其它的用途，这样做将影响到这些功能。
