Git Product home page Git Product logo

bartholomej / material-scrolltop Goto Github PK

View Code? Open in Web Editor NEW
116.0 116.0 26.0 1.04 MB

Lightweight, Material Design inspired plugin for scrolling on top of the html page (with jQuery or TypeScript)

Home Page: http://bartholomej.github.io/material-scrolltop/

License: MIT License

TypeScript 51.18% SCSS 48.82%
back-to-top back-top css jquery material material-design material-scrolltop sass scrolltop svg-icons typescript

material-scrolltop's People

Contributors

bartholomej avatar dependabot[bot] avatar gh640 avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar  avatar  avatar  avatar

material-scrolltop's Issues

CSS source map missing

CSS source map URL is declared but the actual .css.map file is missing.

/*# sourceMappingURL=material-scrolltop.css.map */

Feature request: both top and bottom

Hi is it possible to top and bottom feature

if user top of the page bottom icon will visible and click on bottom it will move to bottom of the page

Plugin working with jquery 3.2.1?

Hi
The console on chrome browser gives me an error when I click the top button:

material-scrolltop.js:46 Uncaught TypeError: $(...).animate is not a function
at HTMLButtonElement. (material-scrolltop.js:46)
at HTMLButtonElement.dispatch (jquery-3.2.1.slim.min.js:3)
at HTMLButtonElement.q.handle (jquery-3.2.1.slim.min.js:3)

I am using bootstrap setup

<script src="https://code.jquery.com/jquery-3.2.1.slim.min.js" integrity="sha384-KJ3o2DKtIkvYIK3UENzmM7KCkRr/rE9/Qpg6aAZGJwFDMVNA/GpGFF93hXpG5KkN" crossorigin="anonymous"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.12.9/umd/popper.min.js" integrity="sha384-ApNbgh9B+Y1QKtv3Rn7W3mgPxhU9K/ScQsAP7hUibX39j7fakFPskvXusvfa0b4Q" crossorigin="anonymous"></script> <script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/js/bootstrap.min.js" integrity="sha384-JZR6Spejh4U02d8jOt6vLEHfe/JQGiRRSQQxSfFWpi1MquVdAyjUar5+76PVCmYl" `crossorigin="anonymous"></script>`

Click event might need two taps on mobile browsers

I heavily modified the button markup and due to :hover styles the first tap on mobile did not trigger the click event on the button.

I suggest modifying the following line
_.btnElement.click(function() {
to
_.btnElement.on('mousedown touchstart',function() {

That would make the click event fire under any circumstances.

Issue in Firefox

Hello, kinda a newbie here. Loved your script and edited it to work with my website but it seems to not be working in Firefox and I cannot figure out why :/ It works edited offline on your demo, but once I upload it to my website it gets broken in FireFox. Here is the website in question: http://dulic.me/about
Would love it if you could help me out. Thanks.

npm install do not include icons/

when I use

$ npm install material-scrolltop --save-dev or yarn

I found the package do not include src/icons/top-arrow.svg, so I compiled by webpack got the error.
but I use bower it's work fine.

my temporary solution:
copy the SVG file into the folder and compile it.

Consider tweaking your build process

Problem:
node-sass does not like the following:

  1. importing css
  2. importing file with explicit extension.
  3. gets confused when there are files with same basename, but extensions css, and scss.

If you save material-scrolltop.css to, say, dist/, then this issue would be resolved.

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.