framework7.angular/kitchen-sink-material/jade/pull-to-refresh.jade

Full Featured Mobile HTML Framework For Building iOS & Android Apps using Angularjs

.page(data-page="pull-to-refresh")
  .navbar
    .navbar-inner
      .left
        a(href="index.html").back.link.icon-only
          i.icon.icon-back
      .center Pull To Refresh
      .right
        a(href="#").link.open-panel.icon-only
          i.icon.icon-bars
  .page-content.pull-to-refresh-content
    .pull-to-refresh-layer
      .preloader
      .pull-to-refresh-arrow
    .list-block.media-list
      ul
        li.item-content
            .item-media
              img(src="http://lorempixel.com/88/88/abstract/1", width="44")
            .item-inner
              .item-title-row
                .item-title Yellow Submarine
              .item-subtitle Beatles
        li.item-content
            .item-media
              img(src="http://lorempixel.com/88/88/abstract/2", width="44")
            .item-inner
              .item-title-row
                .item-title Don't Stop Me Now
              .item-subtitle Queen
        li.item-content
            .item-media
              img(src="http://lorempixel.com/88/88/abstract/3", width="44")
            .item-inner
              .item-title-row
                .item-title Billie Jean
              .item-subtitle Michael Jackson
      .list-block-label
        p Just pull page down to let the magic happen.<br>Note that pull-to-refresh feature is optimised for touch and native scrolling so it may not work on desktop browser.