Datagrid is one of most common used in web design, sometimes it will taking a lot of time to designing table, like header, he zebra row, pagination, etc. In jquery there are a lot of ready to use plugin that I compiled in this post, although grid features will be supported in JQuery UI, maybe is good to know some alternative, before JQuery UI grid came along.
In today post I try to do a little experiment with css animation, with jquery to generating css value on the fly. When this post created the this animation examples only works on firefox and chrome browser.
In this short example I try to create a stack of images, on the default position each of images have a different angle, and rotating to the same angle in the same duration of time. Here I show all of the code.
Creating a jquery plugin is easier than it sound, first time I heard about creating 3rd party plugin sounds scary, maybe need more deeper understanding about the platform, but not in jquery. Well I just feel something missing if I have been using jquery for a while not to creating a plugin.
Few month ago I have created a simple tutorial to rotating image using jquery, now it would be nice if I can used as a plugin, and now it a chance to learning simple jquery plugin.
In today post I want to share how I make a simple sumon math game based on JQuery, this game inspired by hyperandroid, this game it quite nice to practice your self concentration about math addition.
This post will create that simple nice game, just to show that you can make it with simple jquery, please note that I only add the basic rule of the game, which are, we have to pick the total number that matched the appear random number thats all.
Few days ago I browse the apple official site and looking some mac product, the navigation at apple mac page are using an easing effect, it separating each product by the category, I love the effect when user click on the navigation it like the products appear and disappear one by one, with the easing effect on the end movement, like bouncing on the vertical line.
If you see the source code on apple page, seems they are still using prototype.js, once are the most popular javascript framework, before the appearance of jquery. In this post I want to create something like the apple mac navigation menu using jquery easing plugins.
Swipe effect has becoming popular when mobile application usage increase, it a nice touch effect to slide between layout, and some of mobile web application framework has already have this feature for example you can see sencha touch carousel component, but I think the swipe effect can be good enough too, not only for mobile web but for web desktop too. Here I want to share a little idea creating swipe like effect based on jquery UI draggable. Basically the idea is really simple it is the combination of revert option in jquery ui draggable, jquery animation for moving an element, and mouse event for firing when the item have to swipe.
<div id="container">
<div id="swipe_container">
<div class="item">Item Swipe 1</div>
<div class="item">Item Swipe 2</div>
<div class="item">Item Swipe 3</div>
<div class="item">Item Swipe 4</div>
<div class="item">Item Swipe 5</div>
<div style="clear:both"></div>
</div>
</div>
Today post, let’s playing a little code with JQuery and JQuery RadMenu Plugin, cause lately I’ve been thinking about creating circular image gallery my self, and my search stop here for a moment when finding this cool plugins.
This plugin is really cool you can creating a circle from many html element that you defined, which means you don’t have to create a formula to set all the element position to create a circle form.
In today I create a little code snippet in JQuery, this time is about zooming hovered image, this kind of feature might be fit for a web gallery site which have many content, to giving a little quick preview about the item.
Here the code, not really much to say, just playing little with jquery animate function and some CSS property such as top, left, width and height.
Rich Text Editor maybe one of a must feature in publishing web application like wordpress, joomla, or any other CMS, here I’m collecting some of rich text editor based on JQuery, surely it must be used for JQuery lover.
But I cannot find a popular one like TinyMCE or CKEditor, whatever some of this quite good for your project.
A sliding door effect can be used what the site offer. About a week ago I visited a site called auroraos, on the first page I see a nice sliding image gallery on the front page, it used JQuery to creating the effect, it like a vertical accordion, sliding door effect or whatever you called it.
All the images must have the same size, in both width and height, the hovered images will shows entirely, and the others will mostly hidden.
