• BUG笔记:Android原生浏览器不认负百分数margin致Foundation Orbit往右滑动动画出错


    一看这标题就知道无比蛋疼了是不?至少我从来不用安卓自带的浏览器。。。

    发现这个bug的场景:万恶的Foundation,它的滚动图片插件Orbit在安卓自带浏览器下手指从左往右滑动时动画仍旧表现为从右往左滑动。只有在安卓自带浏览器下会发生哦!

    罪魁祸首是foundation写这个插件时候用jQuery的css动画从'marginLeft':'-100%'到'marginLeft':'0%'来实现从图片从左往右滑动进来。而这个傻浏览器并不认负的百分数,不过能认负的数值。

    同时要注意的是,两个百分数要同时改成数值才有效,也就是说-100px到0%的动画也会出错。但100%到0的动画没问题。

    以下是修改的代码截取片段:

        var SlideAnimation = function (settings, container) {
            var duration = settings.animation_speed;
            var is_rtl = ($('html[dir=rtl]').length === 1);
            var margin = is_rtl ? 'marginRight' : 'marginLeft';
            var animMargin = {};
            //修改前:animMargin[margin] = '0%';
            animMargin[margin] = '0';
    
            this.next = function (current, next, callback) {
                next.animate(animMargin, duration, 'linear', function () {
                    current.css(margin, '100%');
                    callback();
                });
            };
    
            this.prev = function (current, prev, callback) {
                //修改前: prev.css(margin, '-100%');
                prev.css(margin, -prev.width());
                prev.animate(animMargin, duration, 'linear', function () {
                    current.css(margin, '100%');
                    callback();
                });
            };
        };
    

      

  • 相关阅读:
    关于回调函数的初探
    细节决定成败
    数据的导航与跳转
    如何在同一页面显示父子表的内容
    从Request到Response之间的所有事件发生的顺序
    如何更改网站的一些公共数据
    如何实现计数器
    DataTable.Select方法
    登出代码
    如何构建自定义控件
  • 原文地址:https://www.cnblogs.com/jennieji/p/3549232.html
Copyright © 2020-2023  润新知