Install Tutorial Changes Github Menu
×
Tutorial
Installation
Linking to fragments
a[up-follow]
[up-method]
[up-fail-target]
[up-fallback]
[up-transition]
[up-fail-transition]
[up-href]
[up-confirm]
[up-history]
[up-restore-scroll]
a[up-target]
[up-target]
[up-method]
[up-transition]
[up-fail-target]
[up-fail-transition]
[up-fallback]
[up-href]
[up-confirm]
[up-reveal]
[up-restore-scroll]
[up-cache]
[up-layer]
[up-history]
[up-dash]
[up-expand]
[up-instant]
up.follow()
up.link.isFollowable()
up.link.makeFollowable()
up.visit()
Modal dialogs
[up-drawer]
[up-position]
[up-modal]
[up-confirm]
[up-method]
[up-sticky]
[up-closable]
[up-animation]
[up-backdrop-animation]
[up-height]
[up-width]
[up-history]
.up-modal [up-close]
up.modal.close()
up.modal.config
up.modal.contains()
up.modal.coveredUrl()
up.modal.extract()
up.modal.flavors
up.modal.flavors.drawer
up.modal.follow()
up.modal.isOpen()
up.modal.url()
up.modal.visit()
up:modal:close
up:modal:closed
up:modal:open
up:modal:opened
Pop-up overlays
[up-popup]
[up-position]
[up-confirm]
[up-method]
[up-sticky]
[up-history]
.up-popup [up-close]
up.popup.attach()
up.popup.close()
up.popup.config
up.popup.coveredUrl()
up.popup.isOpen()
up.popup.url()
up:popup:close
up:popup:closed
up:popup:open
up:popup:opened
Animation
up.animate()
up.animation()
up.morph()
up.motion.config
up.motion.finish()
up.motion.isEnabled()
up.motion.none()
up.motion.when()
up.transition()
Navigation feedback
.up-active
.up-current
up.feedback.config
Custom JavaScript
[up-data]
up.compiler()
up.macro()
up.syntax.data()
Fragment update API
[up-keep]
up.destroy()
up.dom.config
up.extract()
up.first()
up.hello()
up.reload()
up.replace()
up:fragment:destroy
up:fragment:destroyed
up:fragment:inserted
up:fragment:keep
up:fragment:kept
AJAX acceleration
[up-preload]
[up-delay]
up.ajax()
up.proxy.alias()
up.proxy.clear()
up.proxy.config
up.proxy.get()
up.proxy.isBusy()
up.proxy.isIdle()
up.proxy.preload()
up.proxy.remove()
up.proxy.set()
up:proxy:load
up:proxy:received
up:proxy:recover
up:proxy:slow
Forms
form[up-target]
[up-target]
[up-fail-target]
[up-fallback]
[up-transition]
[up-fail-transition]
[up-history]
[up-method]
[up-reveal]
[up-restore-scroll]
[up-cache]
[up-autosubmit]
[up-delay]
[up-hide-for]
[up-observe]
[up-delay]
[up-show-for]
[up-switch]
[up-validate]
up.autosubmit()
up.form.config
up.observe()
up.submit()
up.validate()
Tooltips
[up-tooltip]
[up-animation]
[up-position]
[up-tooltip-html]
up.tooltip.attach()
up.tooltip.close()
up.tooltip.config
up.tooltip.isOpen()
Browser history
[up-back]
up.history.config
up.history.push()
up.history.replace()
up.history.url()
up:history:push
up:history:pushed
up:history:restored
Application layout
[up-anchored=right]
[up-fixed=bottom]
[up-fixed=top]
[up-viewport]
up.layout.config
up.layout.restoreScroll()
up.layout.revealHash()
up.layout.saveScroll()
up.reveal()
up.scroll()
Events
up.bus.nobodyPrevents()
up.bus.onEscape()
up.emit()
up.off()
up.on()
up.reset()
up:framework:reset
Browser support
up.browser.canFormData()
up.browser.canPushState()
up.browser.isSupported()
Server protocol
up.protocol.config
Utility functions
up.fail()
up.util.all()
up.util.any()
up.util.assign()
up.util.compact()
up.util.contains()
up.util.copy()
up.util.detect()
up.util.each()
up.util.escapeHtml()
up.util.except()
up.util.isArray()
up.util.isBlank()
up.util.isDeferred()
up.util.isDefined()
up.util.isElement()
up.util.isFunction()
up.util.isGiven()
up.util.isHash()
up.util.isJQuery()
up.util.isMissing()
up.util.isNull()
up.util.isNumber()
up.util.isObject()
up.util.isPresent()
up.util.isPromise()
up.util.isString()
up.util.isUndefined()
up.util.map()
up.util.merge()
up.util.nextFrame()
up.util.noop()
up.util.once()
up.util.only()
up.util.parseUrl()
up.util.presence()
up.util.reject()
up.util.rejectedPromise()
up.util.remove()
up.util.resolvedDeferred()
up.util.resolvedPromise()
up.util.select()
up.util.selectorForElement()
up.util.setTimer()
up.util.times()
up.util.toArray()
up.util.uniq()
up.util.unresolvableDeferred()
up.util.unresolvablePromise()
Logging
up.log.config
up.log.disable()
up.log.enable()
Changes

The unobtrusive JavaScript framework for server-side applications

Unpoly enables fast and flexible frontends with minimal changes to your server-side code.

Get started
Smoother navigation
Unpoly links can update page fragments instead of full pages. No JavaScript required.
Branch off into layers
Branch off interactions into modals, popups or drawers. Return to the main page when you're done.
Animation
Animate page changes with fade, swipe or zoom transitions.
Faster response times
Outsmart latency by preloading pages, following links earlier, caching responses and keeping a persistent CSS / JS environment.
Structure for JavaScript snippets
Organize your frontend code in compilers and let Unpoly pair HTML elements with JavaScript behavior.
Better forms
Submit forms via AJAX. Work with forms within modals. Validate forms against server rules while filling in fields.
Plays nice with existing code
Migrate any server-side application with minimal changes to existing code.
Extensible
Build your own components using Unpoly's extensive Javascript API and event model.
Degrades gracefully
Unpoly supports all modern browsers. On old IEs features are disabled gracefully.

How it works

  1. Write a server-side app in any language
    Like Ruby, PHP, Node.js, Java, Elixir …
  2. Install the Unpoly Javascript and CSS
    Only 26.3 KB minified. CSS is minimal and non-invasive.
  3. Decorate links with HTML attributes from the future
    Like up-target, up-modal, up-dash …
  4. Enjoy a vastly improved frontend
    With snappy views, layered interactions, animations …
Get started
Made by Henning Koch from makandra (imprint)