我试图将固定的div添加到snap.js(https://github.com/jakiestfu/Snap.js/)中的内容包装器中。我尝试过的一切都失败了,因为snap.js会将所有固定的元素推送到整个画布。是否有此技巧?

我在这里模拟了想要达到的效果

更新:
经过对该问题的进一步调查,我得出的结论是,此固定div需要一个事件侦听器,该事件侦听器将触发相反的transform:translate3d。该脚本通过将transform:translate3d设置为与左抽屉相同的宽度来工作。这是代码段:

x: function(n) {
                if( (settings.disable=='left' && n>0) ||
                    (settings.disable=='right' && n<0)
                ){ return; }

                n = parseInt(n, 10);
                if(isNaN(n)){
                    n = 0;
                }

                if( utils.canTransform() ){
                    var theTranslate = 'translate3d(' + n + 'px, 0,0)';
                    settings.element.style[cache.vendor+'Transform'] = theTranslate;
                } else {
                    settings.element.style.width = (win.innerWidth || doc.documentElement.clientWidth)+'px';

                    settings.element.style.left = n+'px';
                    settings.element.style.right = '';
                }


有谁知道如何编写一个事件监听器,将固定div的transform3d设置为与内容容器相反的数量?

最佳答案

您是否尝试过绝对元素而不是固定元素?

如果保留固定元素,则必须在此元素上添加动画以与菜单同时移动。

固定元素基于页面的同一来源(左上),如果您将其放在其他元素中,则该元素也相同。

绝对值基于第一个元素是相对的。

10-05 20:46
查看更多