Quick Hack To Get VerticalAlign Working On KineticJS.Text

Javascript Programming

In the jungle of Javascript 2D Canvas Libraries we have chosen KineticJS for the development of Polo. As there were so many libraries, It was a tough choice. Each library comes with their own pros and cons. We have selected KineticJS mainly for following reasons:

  • Its has got an easy api to let us draw shapes, group them together with layering support
  • Collection of rich examples, showcase of each feature give quick understanding
  • Currently under active development, so we can assume timely updates and quick issue resolution

Read More …

How to Properly Hide and Show Elements Using Javascript

What is the first solution comes to your mind, when someone asks you

How can I dynamically hide any element using Javascript ?

The obvious solutions to this is to set “display” style to “none”. Something like this:

document.getElementById('element').style.display = 'none';

This will surely work, but is it the correct way to do so? May be not, as you would face problems in showing that element again. The problem in showing that element is that you don’t know the original display property of that element.

Read More …

Energy Saving Javascript

Energy Saving ScriptTitle of this post may seem strange to you but this is true, You can actually save some energy by using this Javascript on your website. Let me tell you how.

This javascript turns the webpage black if there is no user activity on the page for some time. As the page predominantly turn black the script in-effect saves energy.

Image displayed is primarily a function of the user’s color settings and desktop graphics, as well as the color and size of open application windows; a given monitor requires more power to display a white (or light) screen than a black (or dark) screen.

Read More …

How to Create a Simple Slideshow using Mootools / JQuery

slide_show_icon When we want to show lots of content in limited screen space, Slideshows comes to rescue. Making use of slideshows is the optimal way to present large amount of information. In this post i’ll walk you through the process of making a very simple(minimilistic) slideshow using Mootools / Jquery.

 

You must have seen various types of slideshows around the web. Creating such slideshow is also very simple. With little smart code one can make it very quickly.

As it is said “A picture is worth a thousand words”, similarly I believe a demo is worth a thousand words.

Read More …

Another Beautiful Thumbnail Hover Effect : Using Mootools

Some days back I wrote a post regarding “Beautiful Thumbnail Hover Effect“. On getting such a good response about the javascript effect I am again presenting a different thumbnail presentation.

This implementation is little different.  To know more about this effect lets see the demo first.

View Demo

If you have seen the demo then you might be wondering how this image is splitting in middle. Actually to get this effect I have used two instances of the same image.

Read More …

Make Your Links (Hyperlinks) Even More Sexier

HyperLinkYou would have often seen various attempts to make hyperlink more beautiful. One of my personal favorite is to have little icons beside links to let you know where they link to.
Different icons for external links, pdfs, images, etc. etc. You can find the tutorial for such link over here.

In this post i’ll tell you a technique using which you can make your links even more sexier.

Check out the demo first : View Demo

The Implementation of this effect is given in the following sections.

Read More …