<a href="#" title="torna all'inizio del contenuto" class="ScrollTop js-scrollTop js-scrollTo">
  <i class="ScrollTop-icon Icon-collapse" aria-hidden="true"></i>
  <span class="u-hiddenVisually">torna all'inizio del contenuto</span>
</a>
  • Content:
    /** @define ScrollTop */
    
    .ScrollTop {
      @extend .u-posFixed;
      @extend .u-background-95;
      @extend .u-color-white;
      @extend .u-borderRadius-circle;
      @extend .u-borderShadow-xs;
      @extend .u-textCenter;
      @extend .u-linkClean;
      @extend .u-zindex-max;
      @extend .u-text-r-xxs;
    
      border: 2px solid white;
      bottom: 1em;
      height: 3em;
      right: 1em;
      width: 3em;
    }
    
    .ScrollTop-icon {
      @extend .u-inlineBlock;
      @extend .u-posRelative;
      @extend .u-color-white;
      @extend .u-textCenter;
      @extend .u-text-l;
      @extend .u-textWeight-700;
    
      font-size: 2em;
      top: 15%;
    }
    
  • URL: /components/raw/scrolltop/index.css
  • Filesystem Path: src\components\scrolltop\index.css
  • Size: 603 Bytes
  • Content:
    import $ from 'jquery'
    import debounce from 'throttle-debounce/throttle'
    
    const threshold = 100
    
    const _toggleScrolltop = () => {
      ($(window).scrollTop() > threshold) ?
      $('.js-scrollTop').show() :
      $('.js-scrollTop').hide()
    }
    
    $(window).scroll(debounce(500, _toggleScrolltop))
    $(document).ready(_toggleScrolltop)
    
    export default {
      threshold
    }
    
  • URL: /components/raw/scrolltop/index.js
  • Filesystem Path: src\components\scrolltop\index.js
  • Size: 366 Bytes

There are no notes for this item.