• Home
  • Features
  • Pricing
  • Docs
  • Announcements
  • Sign In

trotzig / diffux / 203
98%
master: 99%

Build:
Build:
LAST BUILD BRANCH: animations
DEFAULT BRANCH: master
Ran 24 Feb 2014 04:48AM UTC
Jobs 2
Files 25
Run time –
Badge
Embed ▾
README BADGES
x

If you need to use a raster PNG badge, change the '.svg' to '.png' in the link

Markdown

Textile

RDoc

HTML

Rst

pending completion
203

push

travis-ci

trotzig
Only scroll when necessary on keyboard navigation

This commit replaces the previous usage of the native JS function
`scrollIntoView` with a jQuery solution instead. The new solution:

- Only scrolls when the focused element is hidden.
- Keeps 1/4 of the screen above the focused element (for context).
- Animates the scroll (this improved the experience by *a lot*, because
  you can see exactly what happens)

To figure out if an element is shown on the screen or not, I'm using the
`jquery.visible` Bower plugin. I tried out a couple of alternatives that
did scrolling, but both `jquery.scrollIntoView` (buggy) and
`jquery.scrollTo` (didn't avoid scrolling if it wasn't needed) came in
short.

An important detail about the animation: The previous animation is
cancelled (`stop()`ed) before the next is started. This is important in
order to allow people hammering/holding down j/k.

434 of 445 relevant lines covered (97.53%)

52.48 hits per line

Jobs
ID Job ID Ran Files Coverage
1 203.1 (2.0.0) 24 Feb 2014 04:48AM UTC 0
97.53
Travis Job 203.1
2 203.2 (2.1.0) 24 Feb 2014 04:49AM UTC 0
97.53
Travis Job 203.2
Source Files on build 203
Detailed source file information is not available for this build.
  • Back to Repo
  • Travis Build #203
  • cdbb3c00 on github
  • Prev Build on better-nav-scroll (#202)
  • Next Build on better-nav-scroll (#205)
STATUS · Troubleshooting · Open an Issue · Sales · Support · CAREERS · ENTERPRISE · START FREE · SCHEDULE DEMO
ANNOUNCEMENTS · TWITTER · TOS & SLA · Supported CI Services · What's a CI service? · Automated Testing

© 2026 Coveralls, Inc