仅显示以下 4 篇带「网页」关键字的文章。 返回词云 或 查看全部文章
2013-04-28 by Dron
有一些特定应用，在用户离开当前页面时会弹出一个对话框，询问是否真的离开，给用户多一次选择，以确保未完成的草稿得已保存。
这种弹窗都是在页面的 onbeforeunload 事件里实现的，这个事件还可以用来发送统计请求。我今天在考虑这个问题时来了灵感，如果在这个事件里强制地址跳回本页会如何呢？于是我造了一段测试代码：
window.onbeforeunload = function(){
setTimeout( function(){ location.href = "#"; }, 0 );
};将上面的代码粘贴到任意网页的 console 中执行，神奇的事情发生了：点击该网页的其它链接，根本跳不走，其实是跳走了立刻又被跳了回来（查看控制台的网络面板可以验证）。如果是在地址栏上输入其它地址，回车后也会强制被替回来，有点意思。
在 Chrome/Safari 中测试通过，Firefox 不通过，IE/Opara 未测试，有点暴力，不推荐使用。
2013-01-14 by Dron
这个工具写了有小半个月了，本来想等做完美了再发出来，想想每天的进展这样慢就算了，先发也能更早收到使用者的反馈，初版肯定会有很多 bug，希望大家能够向我提出来。
为了能更快速的完成开发，我们往往会在项目里引入各种各样的 JS 库，而实际上，项目本身对这些 JS 库的利用率很少，很多情况下只是用了它其中的一两个功能，这样导致项目产生大量的冗余代码，一定程度上影响了网页加载速度，如果有方便的工具，可以分析出项目在运行过程中覆盖到的 JS 代码，将大大有利于我们做后续的瘦身工作，Tracker 这个工具的想法就这样产生的。另外，和 JSCoverage 一样，Tracker 也能帮助我们方便地发现测试用例对源码的覆盖程度。
2011-06-27 by Dron
以下这两种情况：
假设这两种情况所使用的时间一样，用户仍然会觉得后者比较慢或者卡，因为后者在准备资源的过程中，网页是静止不动的，给用户有了一段明显等待时间的感觉，而前者虽然也会有等待时间，但相对比较短。
很多中大规模的网页难以采取第一种方式，特别是现在富交互的网页，都需要准备很多资源和数据，为了缓和用户焦躁的心理，于是我们在等待过程中加入了 loading，显式的告知用户网页需要等待。最常见的 loading 形式是一张转圈圈的 gif 图。
但是转圈圈是不断反复的，用户并不能直观地知道他还需要等多久，对于资源或数据比较大的网页来说，转不了几圈，用户也仍然会有慢的感觉，容易被放弃，于是我们采用了加载百分比，显式地告诉他现在的进度，使用户更加有耐心。
2011-06-26 by Dron
网页上，为了方便用户及时看到有价值的信息，通常会采用自动滚屏的交互效果，使变化的信息在第一时间呈现。
滚屏的实现，普遍做法是改变网页根节点的 scrollTop 和 scrollLeft 属性，就像这样：
document.documentElement.scrollTop = 500; // 滚动到 500px 的位置scrollTop 和 scrollLeft 属性接受一个数值，需要涉及到元素位置的计算（记得那个复杂的位置计算的算法么？），对于需要滚动至某个元素可见，scrollTop 和 scrollLeft 不见得是最优的方案，其实，除了这种办法，我们还可以有以下两种办法来达到滚动的目的。
地址栏中 # 号后面的字符串叫做 hash，浏览器在网页打开完成后或者在 hash 值改变时，会自动滚屏至名称与 hash 值相等的锚点元素位置上，利用这个特性，我们可以在需要的位置插入锚名，然后通过改变 location.hash 的值来达到滚屏效果，具体写法这里就不细说了。
这种方案有一定缺陷，在某些浏览器下，hash 值的改变会产生浏览历史记录，导致对历史记录的破坏，影响用户使用前进后退功能；而且，在一些网页里，hash 值可能会有其它的用途，这样做将影响到这些功能。