data-rel

主要使用为下面2个值"back""auto"。主要作用是决定过场的方向,默认都是正向过场,例如slideup效果,是从下面出来。如果是"back",就会从上面出现。有时候,我们无法确定过场的方向,例如,本文档页面左侧的各个链接,因为点击顺序任意的,此时就可以使用"auto",也就是:

<a href="Mobilebone.support.html" class="nav-a" data-mask data-rel="auto">Mobilebone.support</a>

此时,Mobilebone会根据对应page页面的前后顺序确定其正向过场还是反向。

其他说明

  1. data-rel="back"在以前两种场景都是有返回效果的。
    <a href="#pageBack" data-rel="back">返回</a>
    <a href="javascript:" data-rel="back">返回</a>

    那它们的差别在什么地方呢?

    前者返回具有明确的目的性,知道前往的页面,虽然是返回,但是,history依然会push一条访问记录;而没有href的返回,也就是后者只会返回上一次的页面,其作用跟下面代码一样:

    <a href="javascript:history.back();">返回</a>

    真正意义上的浏览器返回,history回退至上一个记录,而不是再塞一条。所以,大家需要根据不同的返回场景做不同的处理。

  2. data-rel其实还支持一个值,"external". 作用和data-ajax="false"一致,感觉有些鸡肋,正犹豫要不要删掉,故没有放在上面讲。