zoukankan      html  css  js  c++  java
  • 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();
                });
            };
        };
    

      

  • 相关阅读:
    Fiddler localhost问题
    Ajax 'sys'未定义
    将字符串中的危险字符替换掉函数 ReplaceStr()
    如何重新注册asp.net 2.0
    Asp.net CS页面调用Javascript进行Alert输出
    Asp.net中插入Flash
    向awk中传递数组
    内存泄漏简介
    awk基本语法几则
    自然连接和等值连接
  • 原文地址:https://www.cnblogs.com/jennieji/p/3549232.html
Copyright © 2011-2022 走看看