Skip to content

moevis/morn-js

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

95 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

morn-js

This is a javascript toolkit library. Just like a lightweght jquery.

It has some useful functions. For example:

Chain your functions.

morn('.class')
  .addClass('class')
  .removeEventHandler('click', function(){ })
  .forEach(function(element,i))

selector

selecting with pleasure!

morn.id('id'); // get element by id;
morn.tag('tagname'); // get elements by tag name;
morn.class('className');  // get elements by class name;

or even you can use as below:

morn('#id');
morn('.class');
morn('tag')

ok, here are more css3 selector:

morn('tag:odd');
morn('tag:even');
morn('tag:first-child');
morn('tag:last-child');
morn('tag > children');
morn('tag').find('selector');

All of them support IE6. With a light weight parser, realizing without regex functions.

events adding, removing and delegating.

Oh, these ought to be supported;

morn('#id').addEventHandler('click', function(e){ });
morn('#id').removeEventHandler('click', func);
morn.ready(function); // invoked when document is ready
morn('#id').delegate('click', 'a', function(){})

like jquery does:

morn('#id').click(function(){});
morn('#id').scroll(function(){});

for IE6/7/8, now hashchange is avaliable.

morn.hashchange(function(){});

style changing

morn('#id').addClass('classname');
morn('#id').removeClass('classname');
morn('#id').hasClass('classname');
morn('#id').getComputedStyle([stylename]);
morn('#id').width();

create dom, append, prepend.

morn.createDom('<h1>Hello, morn!</h1>');
morn('#id').append(doms);
morn('#id').prepend(doms);

some useful document traveling functions like .next(), .prev(), .children(), '.parent()'

save your data in dom.

choose data-* or morn-js according to the browser to save data.

morn('dom').data('id', 10)    // save data
morn('dom').data('id')        // get data
morn('dom').removeData('id')  // remove id
morn('dom').removeData()      // remove all data

promise for async function

morn.promise()                 // return a promise object
  .then(success, failed)     // success function and failed function (optional)
  .reject(value)             // reject the promise
  .catch(handleError);       // runs when any error occurs.

ajax method

send httpxmlrequest, support modern bowsers.

morn.get(url, success, failed);
morn.post(url, dataObject, success, failed);

both of above will return a promise.

matrix transform

use matrix calculate to transform element in css3

morn('dom').matrix()   //return a tranform object. get matrix currently;
morn('dom').matrix().rotate(30).end()   // use end() to apply transform, rotate 30deg.
morn('dom').matrix().rotate(30).translate(10, 50).scale(0.5).end()   //chain the transforms functions

modules loader

mornjs is organized in this way.

morn.define(itself_name, ['dependencies'], function(){}); // 
morn.define(['dependencies'], function(){});  // anonymous function and has dependencies 
morn.define(itself_name, function(){}); // no dependencies
morn.define(function(){});  // no dependencies and anonymous

and even more.

some ui plugins:

resize

sticky

scroll

I will continue working on it.

About

a javascript toolkit library

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published