Archives for 2009

Magnify Images using jQuery

Last updated on July 26th, 2009 by Gabriel Livan

JQuery Image Magnify is a script by Dynamic Drive that enables any image to be magnified by a specific factor when clicked on using a sleek zoom in/out effect. The image is zoomed to the center of the user’s screen. You just have to set a smaller width and height for the image then apply the class ‘magnify’ to it.

This script is extremely easy to set up- to enable the “magnify” effect on any image, just give it a CSS class of “magnify”. It’s time to let you users take a closer look at images on your page!

Source & Demo: http://www.dynamicdrive.com/dynamicindex4/imagemagnify.htm
Tested in: FF1+ IE6+ Opr9+

TypeSelect – Beautifully Rendered and Selectable Typefaces

Last updated on December 30th, 2009 by Gabriel Livan

TypeSelect combines custom fonts with your browser’s native text selection functionality. It does this by leveraging typeface.js, JQuery, the canvas, toDataURL, CSS background properties and real overlayed text. You can interact with beautifully rendered typefaces just like you do with normal text.

Web professionals have been stuck with 9 “web safe” fonts for too many years. There have been some clever solutions (SIFR, FLIR, Typeface.js, Cufon), but text selection has been a tough nut to crack. We think this approach can become a viable workaround until browser technology catches up.

Source: http://www.typeselect.org/
Download: https://sourceforge.net/projects/typeselect/files/typeselect/typeselect.0.1.tar.gz
License: MIT License

Develop Layouts Faster: Elastic CSS Framework

Last updated on December 30th, 2009 by Gabriel Livan

Elastic CSS is a simple framework to layout web-based interfaces, based on the printed layout techniques of 4 columns but with capabilities to unlimited columns combinations. It also has the capacity to make elastic, fixed and liquid layout easily.

Elastic provides a declarative syntax language to define the layout structure and behavior. It’s like having a conversation with your code.

The framework has alot of classes and helpers that will aid in the process of web design. The documentation page of the Elastic CSS provides all the tools for you to start experimenting and trying all kinds of things you can imagine.

Source: http://elasticss.com/
Demo: http://elasticss.com/elastics-sites-gallery/
Download: http://github.com/azendal/elastic/downloads

Insert Google AdSense Ads between your WordPress Blog Posts

Last updated on March 24th, 2015 by Gabriel Livan

According to Google AdSense Program Policies you are allowed to add up to three ad content units in a page. If you have over 10 posts in a page and you wish to insert Google ads between them, you may need to specify the position of each advertisement (for instance, the first is after the 3rd post, the second after the 7th post and the last one is after the 10th post) and make sure that the limit of 3 ad content units is not exceeded. In this short tutorial I will teach you how you can do that. The code can be applied in every page where posts are shown including the index, the archive, the tags and the search results.
Read more from this entry…

How to Separate WordPress Trackbacks and Comments

Last updated on March 21st, 2015 by Gabriel Livan

In this tutorial I will show you how to separate the trackbacks from the comments in a WordPress Post. I recommend this practice because it makes your blog look professional and the readers will follow the conversations much easily.

I will use the WordPress Default Theme (Kubrik) as the test theme where the changes are made. Read more from this entry…

« Previous Page