clubmate.fi

A good[ish] website

Web development blog, loads of UI and JavaScript topics

How to build a custom zepto

Filed under: JavaScript— Tagged with: jquery

Here's a quick guide on building a custom zepto from comfort of your command line.

Either install Zepto to your project with Bower:

$ bower install zepto

Or clone it from Git:

$ git clone https://github.com/madrobby/zepto.git

cd into the Zepto's dir:

$ cd zepto/

Then, (from the Zepto dir) get the tools needed for the custom build process:

$ npm install

Finally the actual build process:

$ MODULES="zepto event ajax form ie" ./make dist

This will make a Zepto with the chosen modules in it, in this case: zepto, event, ajax, form, and ie. The newly created file can found from the dist directory.

Below are the available modules. At least the defaults should be installed in order for Zepto to work.

moduledefaultdescription
zeptoCore module; contains most methods
eventEvent handling via on() & off()
ajaxXMLHttpRequest and JSONP functionality
formSerialize & submit web forms
ieAdd support for Internet Explorer 10+ on desktop and Windows Phone 8.
detectdetectProvides $.os and $.browser information
fxThe animate() method
fx_methodsAnimated show, hide, toggle, and fade*() methods.
assetsExperimental support for cleaning up iOS memory after removing image elements from the DOM.
dataA full-blown data() method, capable of storing arbitrary objects in memory.
deferredProvides $.Deferred promises API. Depends on the "callbacks" module. When included, [$.ajax()](#$.ajax) supports a promise interface for chaining callbacks.
callbacksProvides $.Callbacks for use in "deferred" module.
selectorExperimentaljQuery CSS support for functionality such as $('div:first') and el.is(':visible').
touchFires tap– and swipe–related events on touch devices. This works with both `touch` (iOS, Android) and `pointer` events (Windows Phone).
gestureFires pinch gesture events on touch devices
stackProvides andSelf & end() chaining methods
ios3String.prototype.trim and Array.prototype.reduce methods (if they are missing) for compatibility with iOS 3.x.

There's also a one page app to do to the build for you.

Comments would go here, but the commenting system isn’t ready yet, sorry. Tweet me @hiljaa if you want to make a correction etc.

  • © 2021 Antti Hiljá
  • About
  • Follow me in Twatter → @hiljaa
  • All rights reserved yadda yadda.
  • I can put just about anything here, no one reads the footer anyways.
  • console.log('Smash the patriarchy!')
  • I love u!