Coder Social home page Coder Social logo

iq-scm / stickyscroll Goto Github PK

View Code? Open in Web Editor NEW

This project forked from rickharris/stickyscroll

0.0 0.0 0.0 490 KB

Not currently working or actively developed: A jQuery plugin for creating elements that 'stick' to the top of the window when scrolling down the page

JavaScript 100.00%

stickyscroll's Introduction

#jQuery StickyScroll

Make elements stick to browser window as you scroll

WARNING

Stickyscroll performs very badly in the current versions of Chrome and Firefox at the time of this writing, and I'm not sure I'm capable of fixing it without stripping it down to next to nothing. So, development is not very active right now. If you'd like to see an example of the problem stripped down to its most basic case, see the demo-basic.html file. Look at the source in that file and see if you have any ideas to make it work again. It looks to me like the window.onscroll function just doesn't fire enough to make this a viable option anymore.

##Usage:

  • $('selector').stickyScroll({ container: $(container-element) })

    This is "auto" mode. The sticky element will never cross the boundaries of the specified container.

  • $('selector').stickyScroll()

    This is also "auto" mode, but the container will be the body tag.

  • $('selector').stickyScroll({ topBoundary: '100px', bottomBoundary: '200px' })

    This is "manual" mode. The boundaries are relative to the top and bottom of the document, and the sticky element will never cross those boundaries. So, in the example given, the top of the sticky element(s) will never be above 100 pixels from the top of the document and the bottom of the sticky element(s) will never be below 200 pixels from the bottom of the document.

  • $('selector').stickyScroll('reset')

    Use this command to rid an element of any stickiness

##Notes:

  • Requires jQuery 1.4+ or include the offset.js file from newer jQuery source (http://github.com/jquery/jquery/blob/master/src/offset.js)
  • Disclaimer: Requires position: fixed support, so no IE6 No longer uses fixed positioning, only mimics it. Much better support now for mobile/tablet.
  • Possible enhancements to come:
    • Fluid/elastic layout support Now supports fluid layouts! (best in "auto" mode)
    • Support for callbacks when a boundary is reached

stickyscroll's People

Contributors

rickharris avatar

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.