空的技术栈^tm

Flex

<div class="rk-portfolio__items">
   <div class="rk-item rk-item--flex item-4 rk-item--hover" 
      data-bg-src="origin" 
      data-img-src="assets/img/project-3.jpg">
    <!-- meta -->
  </div>
  ...
</div>

var flexHover = new peHoverImg();
flexHover.init({
  reverse: true
});

Static

<div class="ae-grid">
  <div class="ae-grid__item item-lg--auto">
    <div class="rk-item rk-item-static--hover" data-bg-src="assets/img/project-6.jpg">
      <img src="assets/img/project-3.jpg" />
      <!-- meta -->
    </div>
  </div>
  ...
</div>

var staticHover = new peHoverImg();
staticHover.init({
  elems: '.rk-item-static--hover',
  transition: '1.3s'
});

Waistcoat vegan

Graphic Design

Gentrify artisan

Graphic Design

Waistcoat ugh

UI/UX

Masonry

<div class="ae-masonry">
  <div class="rk-item ae-masonry__item rk-item-masonry--hover">
    <img src="assets/img/project-1.jpg" />
    <!-- meta -->
  </div>
  ...
</div>

var masonryHover = new peHoverImg();
masonryHover.init({
  elems: '.rk-item-masonry--hover',
  bgSrc: 'assets/img/project-11.jpg'
});

Essential Stationery

Branding

Pickled Tousled

Art Direction

Waistcoat vegan

Graphic Design

Tumblr hammock

Packaging

Biodiesel etsy

Branding

Gentrify artisan

Graphic Design

Plaid austin

Graphic Design

Trust fund

Packaging

Gentrify pork

Branding