06.2.2010

Apply a custom font to your website, Works on all Browsers

Bookmark and Share
Add to DZone

For web developers and web designers who want to add their FONT to websites without using Standard Web Fonts and without making text as images.

Google has create a Google Font API for public use to give web developers and web designers the ability to use extra fonts on the web, not only the standard web fonts.

Read more »

01.5.2010

More about jQuery AJAX

Bookmark and Share
Add to DZone

jQuery made AJAX simple by using .ajax() function.
The syntax for this function is:

$.ajax( /* properties */);

Now let me explain what properties we can use in this function.

First, I would like to tell you what basic (standard) options for .ajax() as follow:
Properties:
- url: String /* The URL to send the request to */
- type: String /* The request type ("GET", "POST") */
- contentType: String /* default: "application/x-www-form-urlencoded" */
- data: Object, String /* Data to be sent to the server. It is converted to a query string, if not already a string. It's appended to the url for GET-requests. See processData option to prevent this automatic processing. Object must be Key/Value pairs. If value is an Array, jQuery serializes multiple values with same key i.e. {foo:["bar1", "bar2"]} becomes '&foo=bar1&foo=bar2' */

Events:
- beforeSend: Function /* This function runs just before sending the request */
- success: Function /* This is an important part. Here we run the code because the request is done */
- complete: Function /* This function runs after the success is done and errors are shown */
- error: Function /* This function runs when error occurred
function(ajaxHnadler,eventHandler){
// ajaxHandler: xmlHTTP object
// eventHandler: handles the event as string
*/
- timeout: Function /* runs when request is timed out */

There are more options, you can check them on jQuery website.
Actually, I cannot create a demo to test all mentioned properties and methods... So, if you experienced a problem or need some help, please contact me.

For more information about jQuery AJAX Please visit: click here.
You can also read about .GET and .POST

08.3.2009

jQuery: Catch Keyboard Events

Bookmark and Share
Add to DZone

Link: http://www.freelancer-id.com/files/jkey/

Lot of jQuery projects relies on keyboard/mouse event like pressing "p" for previous and "n" for next also using the arrows.

Because this is important, I have managed a code to get the keyboard character on 3 events:
- Keypress
- Keyup
- Keydown

I have created a function to return the key as below:

function getKey(key){
if ( key == null ) {
keycode = event.keyCode;
// To Mozilla
} else {
keycode = key.keyCode;
}
// Return the key in lower case form
return String.fromCharCode(keycode).toLowerCase();
}

Now let's use the events:

/*Keypress*/
$(document).keypress(function (eh){
alert("Keypress: The key is: "+getKey(eh));
});

/*Keyup*/
$(document).keyup(function (eh){
alert("Keyup: The key is: "+getKey(eh));
});

/*keydown*/
$(document).keydown(function (eh){
alert("Keydown: The key is: "+getKey(eh));
});

To see an exaple of this code, please check the demo below:
jKey demo

Have fun.

06.3.2009

jQuery Image Map

Bookmark and Share
Add to DZone

Link: http://www.freelancer-id.com/files/map/

Hi reader,
Today i have experienced something new with images.
I created HTML page contains image. This image was mapped by using <MAP tag.

Actually,
You can’t find these areas when are browsing this page.. Because these areas (dimensions) are hidden and have nothing to be identified.

So, I was looking for way to identify these areas with something till i had an idea of adding borders or creating a floating DIV with 0.3 opacity to tell the visitor that you are pointing to this area.

Read more »

05.4.2009

Top 5 jQuery image galleries

Bookmark and Share
Add to DZone

I have collected some jQuery image galleries for you to choose your preferred one. Each one is working in different way than the other.
Here is the list of the top 5 jquery image galleries:

Read more »

:: Next >>

Free Blog Themes / Templates