说说返回顶部

2014-03-02 0:31

大型站点,小型站点,个人博客都会折腾一个小小的功能如下图:

不过小编我一直都有点用不习惯,为什么?因为我觉得一个返回按钮有点鸡肋。大家回忆一下,我们的键盘上是不是有一个叫“home”的按键,一直默默的趴在那里,等着你。

对!它就是我今天的主角。
再长的页面,按一下,轻松回到网页顶部。

 

出现这个“返回顶部”按钮功能,乌鸦觉得是必然的,现在的网页越来越长,尤其是一些拥有大量回复,又或者是大量信息的网站,鼠标滚动下去后想回去顶部,太麻烦了,很多用户选择直接关闭页面,再加上国内用户在使用习惯上的差异,导致跳失率增加,所以只好在页面上增加一个浮动固定位置的div层,挂上几个字“返回顶部”。

故此这个按钮就就这么忽然间布满了各种大小网站。杂时代也免不了所谓的世俗一把,右下角也有。

 

乌鸦在这里给大家推荐另一种返回顶部的方法:双击空白处返回网页顶部

这个方法如果不给用户一点提示,根本发现不了。其实这个方法是乌鸦在刚接触WordPress时就看到的了,现在想想其实它也是一个不错的方式,所以分享一下(也许乌鸦分享的这个功能代码已经很老、很旧,但是却是一个很好的功能)。

实际上实现WordPres主题双击空白部分返回顶部的方法很是简单,只需要把下面JS代码加到主题的头部模版(header.php)中,</head>之前。

PS:本文中说到的网站空白部分,指的是背景处。

另外这个“空白处双击返回顶部”,好像还和一些第三方的div按钮层级有关系,举个例子:花瓣的采集按钮、wordpress 灯箱插件等,会出现点击无效,在此就要尝试修改div等级关系了~呵呵

乌鸦是个代码小白,偶尔折腾一下代码,所以要说出一个所以然来也是不太可能的,在处理div层级关系的时候就要靠万能的谷哥、度娘和必硬了~


网友评论3条

  1. 马克互联网  − 2014-03-2 0:31 回复TA

    很清爽简洁的主题

  2. Zs  − 2014-03-2 0:31 回复TA

    原来我笔记本键盘上最右边一排home,pg up,pg dn,end 还有这些功能…科普了