Cacher is the code snippet organizer for pro developers

npm i jquery.backstretch

terminalで叩く

package.jsonで確認

直接追加 libs

  "browser": {
    "jquery": "./js/libs/jquery.js",
    "lodash": "./js/libs/lodash.min.js",
    "mobileEvents": "./js/libs/jquery.mobile-events.js",
    "slick": "./js/libs/slick.js",
    "velocity": "./node_modules/velocity-animate/velocity.js",
    "waypoints": "./node_modules/waypoints/lib/jquery.waypoints.js",
    "inview": "./js/libs/jquery.inview.js"
  }

import $ from 'jquery';
import { $WINDOW, isWindows, isMobile, getCookie } from './helpers';
import _debounce from 'lodash.debounce';
var imagesLoaded = require('imagesloaded');

// modules
import Effect from './modules/effect.js';
import Scroll from './modules/scroll.js';
import Slider from './modules/slider.js';
import fix_scroll from './modules/fix_scroll.js';
import Backstretch from './modules/backstretch.js';
// 1 import and make name


export default class {

  constructor(el) {
    this.$el = $(el);
    this.$body = $('body');
    this.body = document.body;

    this.initialize();
    this.bind();
  }

  initialize() {
    this.modules = {
      effect: new Effect('.js-waypoint'),
      scroll: new Scroll('.js-scroll'),
      slider: new Slider('.js-slide'),
      fix_scroll: new fix_scroll('.js-check_transitioned_pc'),
      fix_scroll: new fix_scroll('.js-check_transitioned_sp'),
      backstretch: new Backstretch("#anc_experience")
      //backstretch: newの指定,use same name
      
    };
  }

  bind() {
    $WINDOW.on('load.tama_tosho', this.onLoadProject.bind(this));
    imagesLoaded('body', () => { this.body.classList.add('is-loaded'); $('body').trigger('onInitBody'); });
  }

  onLoadProject() {
    this.body.classList.add('is-loaded');

    if(isWindows()) {
      this.body.classList.add('windows');
    }
  }

}

import $ from 'jquery';
import { $WINDOW, isMobile } from '../helpers';
import 'mobileEvents';
import { _debounce } from 'lodash.debounce';
import { backstretch as _back } from 'jquery.backstretch';
import ViewBase from '../view_base';

//console.log(backstrech);

/**
 *
 */
export default class extends ViewBase {

  constructor(el) {
    super(el);

  }

  initialize() {
    super.initialize();
  }

  bind() {
    this.$body.on('onInitBody', this.onLoadWindow.bind(this));
    this.$el.on('init', this.onSlideInit.bind(this));
  }

}