JCrop gives you Powerful image cropping feature using JQuery

If you are someone who is looking for Image cropping functionality in your web application, try considering JCrop. Jcrop is the quick and easy way to add image cropping functionality to your web application. It combines the ease-of-use of a typical jQuery plugin with a powerful cross-platform DHTML cropping engine that is faithful to familiar desktop graphics applications. Best of all, JCrop also features clean, well-organized code that works well across most modern web browsers.

JCrop

JCrop

JCrop Feature Overview

  • Attaches unobtrusively to any image
  • Supports aspect ratio locking
  • Supports minSize/maxSize setting
  • Callbacks for selection done, or while moving
  • Keyboard support for nudging selection
  • API features to create interactivity, including animation
  • Support for CSS styling

Cross-platform Compatibility

  • Firefox 3
  • Safari 3
  • Opera 9.5
  • Google Chrome 0.2.x
  • Internet Explorer 6+

Download JCrop from here.

How Do I Get Started with JQuery?

Its simple. All you need to do is download JQuery from here. Place the relevant libraries on your webserver so that you can request them from your application. Also, importantly, ensure that you have  jQuery installed and included.

In the page <head> you’ll need to load the requisite files. That includes:

  • jQuery library
  • Jcrop Javascript
  • Jcrop CSS stylesheet

It should look something like this:

<script src="js/jquery.pack.js"></script>
<script src="js/jquery.Jcrop.pack.js"></script>
<link rel="stylesheet" href="css/jquery.Jcrop.css" type="text/css" />

Please note: These are only example paths, you probably will need to adjust them when you actually use them, to match the location of the files on your server. Jcrop will not function properly if you don’t.

Invocation

Let’s suppose we have this image our markup:

<img src="flowers.jpg" id="cropbox" />

To convert this into a Jcrop widget, insert the following script:

<script language="Javascript">
    jQuery(function() {
        jQuery('#cropbox').Jcrop();
    });
</script>

Jcrop’s default behavior is activated. Since there are no event handlers attached, it won’t do anything cool, but you can see how easy it is to implement Jcrop into your page.

You can follow me on Twitter at http://twitter.com/vaibhav1981

Do stay tuned to Technofriends for more, one of the best ways of doing so is by subscribing to our feeds. You can subscribe to Technofriends feed by clicking here.

Advertisements

[How-To] Make your USB Disks Perform Faster

This simple hack is particularly useful if you leave your USB Hard Disk permanently connected to your laptop or PC. If you are sure that the USB drive will always be connected, it can be configured to perform faster. 

Follow the steps below to configure your USB Drive to perform faster. 

1.) In Control Panel, click on System. Under System dialog, click on Hardware and then Device Manager. 

2.) Under Device Manager, expand the Disk Drives section. 

Optimizing USB Disks for Performance

Optimizing USB Disks for Performance

3.) Select your Drive and right click to open Properties.

Performance Tuning your USB Drive

Performance Tuning your USB Drive

4.) Under Policies, select Optimize for Performance. Click OK.

That is it. You are done. For a USB drie, when you enable Optimize for Performance, it is enabled for write caching which in turn leads to beter speed and therefore better performance.

You can also follow me on Twitter at http://twitter.com/vaibhav1981

Do stay tuned to Technofriends for more, one of the best ways of doing so is by subscribing to our feeds. You can subscribe to Technofriends feed by clicking here.

[How-To] Add Contact from an Email in Outlook

Often many people email me asking for simple stuff. This post is motivated from one such email. Usually people follow a cumbersome process to add contacts to their outlook contact list, instead they can just follow a simple process and them to their list while being at their inbox. This post describes that simple process.

If you are looking at adding a contact from an email into your Outlook Contacts, follow the steps below.

1.) Open the email message in Outlook from which you wish to add the contact in your Outlook Contacts.

2.) Once the email message is open, right click on the name of the contact you wish to add to your Outlook Contacts.

3.) Select Add to Outlook Contacts.

 

Add contacts in your Outlook Contacts from an Email.

Add contacts in your Outlook Contacts from an Email.

4.) Fill out necessary details. Save and Close.

You can also follow me on Twitter at http://twitter.com/vaibhav1981

Do stay tuned to Technofriends for more, one of the best ways of doing so is by subscribing to our feeds. You can subscribe to Technofriends feed by clicking here.

Cheers

Vaibhav

[How-To] Schedule Email Delivery of your Google Analytics Traffic Report

Google Analytics is a very powerful analytics tool for analyzing various traffic related information for your website.

Google Analytics also provides Email delivery of your traffic report. In order to setup an email delivery of your traffic report, follow the steps mentioned below.

1.) Login to your Google Analytics account.

2.) Once logged in, go to the dashboard for your particular website. 

Configuring Google Analytics Email delivery of reports.

Configuring Google Analytics Email delivery of reports.

3.) Click on the link which says “Dashboard”. Refer to the image above.

4.) You now have two options, either to send the report now itself, or to Schedule it for future deliveries.

5.) In this post we will concentrate on Scheduling Email delivery. For this, click on the tab “Schedule”.

6.) Enter key information like mail id’s to which you wish to send this report, Subject, Small description, Format ( choose pdf, preferrably) and time interval. I have the interval set to Weekly. 

 

Enter all the relevant information for scheduling Email delivery.

Enter all the relevant information for scheduling Email delivery.

7.) Click on Schedule once you are done with filling all the necessary information.

Now your Email Schedule is created. Based on the chosen time interval for delivery you will be receive Email delivery of the reports.

You can also follow me on Twitter at http://twitter.com/vaibhav1981

Do stay tuned to Technofriends for more, one of the best ways of doing so is by subscribing to our feeds. You can subscribe to Technofriends feed by clicking here.

Cheers

Vaibhav

List of Major IP Addresses Blocks By Country

Nirsoft, the creators of WirelessKeyView, software which can help you get your Wireless Keys in case if you have forgotten them, have now released the Major IP Addresses Blocks by Country. 

For countries in europe and in the middle east, the name of the company/Internet provider that own these IP blocks is also displayed. In order to show only the major IP blocks, only IP blocks with 4096 addresses or more were added to the list. For United States, only IP blocks with 65536 addresses or more were added to the list.

You can access the complete list on Nirsoft’s Website.

What is an IP Address? How can i find my IP Address?

IP Address is in short, the address of your computer. Using this address it is identified over the internet and your local network. Since these numbers are usually assigned in country- or region-based blocks, an IP address can often be used to identify the location from which a computer is connecting to the Internet.

If you are interested to know your IP Address, read What’s your IP Address?

 

How to Use this List? Can you give some Example Usages?

Well, to take practical scenarios, First example to take from this list is that it can be used to identify the location of a particular IP. This could be the IP of the person who sent you a mail on your Yahoo Mail account or IP of the person who sent you a mail on your Gmail account

The other example usage can be testing your web application for geo-targeting. If you have a web application which geo-targets content based on the end user’s IP address, you can use any of the IP Address listed against the country of your choice and test your Web Application. This can be done by enabling and Modifying the X-Forwarded-For header in the HTTP Request. To do this, you can either use Fiddler or Modify HTTP Headers.  

The X-Forwarded-For (XFF) HTTP header is a de facto standard for identifying the originating IP address of a client connecting to a web server through an HTTP proxy or load balancer. This is a non-RFC-standard request header which was introduced by the Squid caching proxy server’s developers.

Also, if you are a geek, you can develop your own script to figure out the location of a particular IP Address using the IP Address Blocks given in the list released by Nirsoft.

Can you List any other website which helps me find the location of a given IP Address?

Yes. Try out IP2Location

 

Also ReadHow does Google knows if you are a Adsense client and clicking on your own ads?

How-To Send Free SMS using Yahoo Mail?

You can follow me on Twitter at http://twitter.com/vaibhav1981

Do stay tuned to Technofriends for more, one of the best ways of doing so is by subscribing to our feeds. You can subscribe to Technofriends feed by clicking here.

Cheers

Vaibhav Pandey

[How-To] Add Flickr Photos to your Word Documents with Ease

What do you do when you have to embed an image from Flickr into your Word Documents? Download the image from Flickr onto your own computer and embed it using Insert Image feature of Word. If you are also the one who does the same thing and wastes a lot of time and bandwidth doing all this download and insert, their is good news for you.

 

Flickr4Word is a Plugin for Microsoft Word 2007 software that allows you to insert Flickr photos into your posts. All you need to do is install this software and get started.

 

Flickr4Word lets you embed Flickr Images into Word with Ease.

Flickr4Word lets you embed Flickr Images into Word with Ease.

The plug-in enables you to search all your content, photosets, or search by tags.  It is available for free and can be downloaded from Codeplex.  For developers, the code is also made available if you want to contribute fixes and features (that comply with Flickr API terms of use).

Also Read[How To] Convert PDF to Word files for free

Kingsoft Office 2007: Microsoft Office comes free

How-To: Copy Excel cells into a Word document

 

You can follow me on Twitter at http://twitter.com/vaibhav1981

Do stay tuned to Technofriends for more, one of the best ways of doing so is by subscribing to our feeds. You can subscribe to Technofriends feed by clicking here.

Cheers

Vaibhav Pandey

[How-To] Setup Multiple Monitors on your Computer

If you are one of those who works with multiple windows and finds it tough to work on a single monitor, this post will help you configure multiple monitors for your computer.

In this post, we will integrate another monitor with your computer’s existing monitor.

A Multiple Monitor Setup

A Multiple Monitor Setup

In order to configure your computer with another extended monitor, follow the steps mentioned below

1.) First things first, get another monitor and connect the input cable of the monitor to your VGA card output of your computer. 

 

Insert your monitor input cable to the output of your VGA Card.

Insert your monitor input cable to the output of your VGA Card.

2.) Now, right click your mouse in an empty area on your desktop and select Properties. 

After selecting Settings tab, you should see two monitor icons.

After selecting Settings tab, you should see two monitor icons.

3.) Click on the tab which says “Settings”. Here you should see both the monitors as 1 and 2. If you dont see two monitor icon’s as listed in the image above.

Check the option for Extending your display to the second monitor.

Check the option for Extending your display to the second monitor.

4.) Select the monitor icon which says 2 i.e. the icon for the second monitor. Click on the checkbox which says “Extend my Windows desktop onto this computer”.

5.) Click on Apply and press OK. Now you are all set to work with your Two monitors. 

Follow the above process to setup any number of monitors your computer supports.

If you select the checkbox which says “ Use this device as primary” , your new monitor will be the primary monitor. This is useful if you work on a laptop but would always prefer working on a larger screen.

The only issue with default Multi Monitor setup is that Windows will not extend the TaskBar to the other monitors and all windows will be shown on the single windows taskbar on a primary monitor. In order to get rid of this problem, i would suggest you download and install MultiMon Taskbar.

Also Read: How-To: Disable and Re-enable USB Storage Devices

Interesting Keylogger Detection Algorithm

Some notes on Ethical Hacking

SVCHOST.exe and the mystery behind it.

You can follow me on Twitter at http://twitter.com/vaibhav1981

Do stay tuned to Technofriends for more, one of the best ways of doing so is by subscribing to our feeds. You can subscribe to Technofriends feed by clicking here.

Cheers

Vaibhav Pandey