Object literal object builder error javascript

综合技术 2018-05-18 阅读原文

I am trying to organize my code using the object literal pattern, but I am getting an error: Uncaught ReferenceError: backToTop is not defined

Any ideas why?

Here's the code:

(function($){

  var Mk = {

    config: {},

    init: function(config) {
      backToTop();
      wow();
      progressBarAnimation();
      slabText();
    },

    backToTop: function() {
      $('body').append('
Back to Top
'); $(window).scroll(function () { if ($(this).scrollTop() != 0) { $('#toTop').fadeIn(); } else { $('#toTop').fadeOut(); } }); $('#toTop').click(function(){ $("html, body").animate({ scrollTop: 0 }, 600); return false; }); }, wow: function() { var wow = new WOW({ boxClass: 'wow', animateClass: 'animated', offset: 0, mobile: true, live: true }); wow.init(); }, progressBarAnimation: function() { $.each($('div.progress-bar'),function(){ $(this).css('width', $(this).attr('aria-valuetransitiongoal')+'%'); }); }, slabText:function() { $("h1.mklife").slabText({ "viewportBreakpoint":400 }); }, last:'' }; $(document).ready(Mk.init()); window.Mk = Mk; })(jQuery)
  • Edit: I had missed the actual function call parentheses on document ready: $(document).ready(Mk.init());

The functions backToTop
, wow
, progressBarAnimation
, slabText
are methods of the Mk object, to access them reference the Mk object

init: function(config) {
  Mk.backToTop();
  Mk.wow();
  Mk.progressBarAnimation();
  Mk.slabText();
},

or since init is also a method of the same object you can access the function with the this
keyword

init: function(config) {
  this.backToTop();
  this.wow();
  this.progressBarAnimation();
  this.slabText();
},
Hello, buddy!

责编内容by:Hello, buddy!阅读原文】。感谢您的支持!

您可能感兴趣的

ReactJS一点通 作者:卢文喆 腾讯云 UI工程师 导语 | 当React 刚开始红的时候,一直觉得 JSX 的设计思想极其独特,属于革命性的创新,它性能出众,代码逻辑却非常简单,所以,受到很多开发者的关注和使用,认为它可能是将来 Web 开发的主流工具。 React 最早起源于 Facebook 的一...
A discussion regarding pure JS apps Recently, the necessity to build a portal for my team to share the current projects and their progress came into the picture, so I tought that this ti...
ideas to animate several individual parts of a lar... I have a large graphic at the top of a page. It's a bunch of logos, with each one sitting on its own little section of the graphic. I'd like for new ...
Qdt-components & picasso.js — More Charts! We have been adding more features to our qdt-components and some of these are the latest picasso.js charts. This story details the charts that we ...
A speed comparison between web grids for ASP.NET When creating web apps, the responsiveness of your app should be priority 1, 2, and 3. If your app spends a minute to load on your CEO’s iPhone, ...