脚本语言 订阅所有【脚本语言】的日志

增强用户体验修改一例

编辑:dnawo 日期:2014-05-19

字体大小: 小 中 大
给客户做了一个微信上的订单查询页面，反馈说输入内容时输入框被遮挡住了，用户体验不好：



原因是版权一处设计成浮动的，始终显示在浏览器底部，当输入内容时打开了手机输入法占据了一部分空间，进而使浏览器窗口变小，版权向上浮动导致输入框被遮挡。虽然即便没有被遮挡，若要输入订单号也仍需向上拉动页面，但被遮挡用户体验上终归不好，必须的必须改。

修改目的很明确：打开手机输入法时让版权消失。简单暴力的修改方法是取消版权浮动，但这会带来新的用户体验问题，比如在PC浏览器打开页面然后最大化， 版权可能显示在页面中部。有没有更好的解决方案？办法总比困难多，最终解决方法是保持版权浮动，仅在浏览器窗口高度小于文档高度时暂时隐藏版权，几行脚本就能解决，代码如下：

复制内容到剪贴板程序代码 程序代码
$(window).resize(function () {
    if ($(document).height() > $(window).height()) {
        $("div[data-role='footer']").hide();
    }
    else {
        $("div[data-role='footer']").show();
    }
});




上一篇: jQuery判断滚动条滚到页面底部脚本
下一篇: 安卓手机通知栏新短信通知清除不了解决方法
文章来自: 本站原创
引用通告: 查看所有引用 | 我要引用此文章
Tags:
最新日志:
评论: 0 | 引用: 0 | 查看次数: 3000
发表评论
请登录后再发表评论！