在WordPress中实现Webflow JS

时间:2019-01-14 作者:Sridhar Katakam

我正在努力实现Webflow\'s horizontal scrolling 在WordPress中。

HTML Webflow导出(工作):https://horizontalscrolling.demo.site/webflow/horizontal-scrolling/

我的WordPress尝试(不工作):https://horizontalscrolling.demo.site/horizontal-scrolling/

正如您在WordPress版本中所看到的,向下滚动不会使紫色部分中的图像水平移动。

我的问题是:

如何在控制台中修复此JS错误

webflow.js:16 Uncaught TypeError: Cannot read property \'tram\' of undefined
    at Object.<anonymous> (webflow.js:16)
    at n (webflow.js:7)
    at Object.<anonymous> (webflow.js:7)
    at n (webflow.js:7)
    at Object.<anonymous> (webflow.js:16)
    at n (webflow.js:7)
    at Object.<anonymous> (webflow.js:16)
    at n (webflow.js:7)
    at webflow.js:7
    at webflow.js:7
  1. webflow.js 是一个巨大的文件(155.3 KB)。当然,实际的相关代码只是一小部分。我如何确定它是什么部分,以便我可以使用它

    自定义功能插件中的代码:

    wp_enqueue_script( \'main\', plugin_dir_url( __FILE__ ) . \'assets/js/main.js\', array( \'jquery\' ), \'1.0.0\', true );
    
    wp_enqueue_script( \'webflow\', plugin_dir_url( __FILE__ ) . \'assets/js/webflow.js\', \'\', \'1.0.0\', true );
    
    where main。js是:

    (function($) {
        $("html").attr("data-wf-page", "5c37e0e1e3cff796d50e5cca");
        $("html").attr("data-wf-site", "5c37e0e1e3cff72e980e5cc5");
    })(jQuery);
    
    提前谢谢。

1 个回复
SO网友:Sridhar Katakam

让它工作起来。

我不得不在HTML标记中添加更多的数据属性,以匹配Webflow导出中的属性。

然后替换的两个实例window.$ 具有window.jQuery 在webflow中。js。要添加的替代方案var $ = jQuery 在该文件的开头。

现在需要弄清楚如何修剪webflow。js到所需的实际代码。。