https://github.com/gowthamrm/ember-scroll-progress

A Ember Addon to display a page's scroll via progress bar.
https://github.com/gowthamrm/ember-scroll-progress

ember-addon emberjs progress-bar scroll

Last synced: 3 days ago
JSON representation

A Ember Addon to display a page's scroll via progress bar.

• Host: GitHub
• URL: https://github.com/gowthamrm/ember-scroll-progress
• Owner: gowthamrm
• License: mit
• Created: 2017-03-26T16:39:53.000Z (over 7 years ago)
• Default Branch: master
• Last Pushed: 2017-10-02T09:15:59.000Z (about 7 years ago)
• Last Synced: 2024-09-07T03:46:59.013Z (27 days ago)
• Topics: ember-addon, emberjs, progress-bar, scroll
• Language: JavaScript
• Homepage: https://gowthamrm.github.io/ember-scroll-progress/
• Size: 747 KB
• Stars: 5
• Watchers: 2
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md
  • License: LICENSE.md

Awesome Lists containing this project

README

        
# ember-scroll-progress

[![npm version](https://badge.fury.io/js/ember-scroll-progress.svg)](https://badge.fury.io/js/ember-scroll-progress)

[![Build Status](https://travis-ci.org/gowthamrm/ember-scroll-progress.svg?branch=master)](https://travis-ci.org/gowthamrm/ember-scroll-progress)

A simple ember addon component for displaying an amount a page is scrolled via a progress bar.

Scroll the page to view this page's progress on top.

[DEMO](https://gowthamrm.github.io/ember-scroll-progress/)

## Usage

```handlebars

  {{#ember-scroll-progress

    height=5

    color="red"

    reduceOffsetTopBy=85

  }}

    

  {{/ember-scroll-progress}}

```

## Parameters

* `height` to customize the the height of the progress bar.

* `color` to provide a customizable color/color code for the progress bar.

* `reduceOffsetTopBy` to set the top offset based on the scroll container's top position inside the page.

## Installation

* `git clone ` this repository

* `cd ember-scroll-progress`

* `npm install`

## Running

* `ember serve`

* Visit your app at [http://localhost:4200](http://localhost:4200).

## Running Tests

* `npm test` (Runs `ember try:each` to test your addon against multiple Ember versions)

* `ember test`

* `ember test --server`

## Building

* `ember build`

For more information on using ember-cli, visit [https://ember-cli.com/](https://ember-cli.com/).