I was searching a good jQuery plug-in for image zooming but couldn't find any which was matching my criteria. I need the lens effect while zooming images and it should work without much plumbing. So, I decided to create one and now sharing this with everyone.

What I need to use this?

1. jQuery
2. ImageLens plug-in – jquery.imagelens.js
3. An image

How to use this?

Include jQuery and jquery.imageLens.js in you web page -

<script src="jquery.js" type="text/javascript"></script>
<script src="jquery.imageLens.js" type="text/javascript"></script>

For default image lens just use imageLens as below. Note that it will automatically calculate actual size of image and start showing zooming -

Topbar message box plug-in can be used to showing message box or notifications on a web page. This is very simple to use and easy to configure. Of course you need jQuery to use this.

Usage

To use this plug-in include jQuery and juery.topbar.js in you web page -

<script src="jquery.js" type="text/javascript"></script>
<script src="juery.topbar.js" type="text/javascript"></script>

Now create a html element which you want to show in topbar as messagebox -

<p>
    <a href="javascript:void(0)" id="demo01">Demo 1 - Simple</a>
</p>
<div id="demo01-body" style="display:none;">
    This is a simple demo
    <span style="font-size: small">(click to close)</span>
</div>

When you create a web page you usually keep in mind how it will rendered on the browser and its usability. Sometime, depending upon the content, you also know that your page might be printed by end user. But you don’t want that the printer version of your page to be same as the screen version. Most of the time you might create a separate printable version of the page. User will click specially open the printable version and take its print or sometime he will directly print your webpage.

Now what are the issues here -

1. The web page is not printer friendly therefore the content might get distorted while printing it into a A4 size paper.
2. The print will contain unnecessary links and images while have no use in printable version.
3. The webpage might have dark background which will lead to wastage of print ink.
4. Some text might have light colors which may not be visible clear on a black & white printout.
5. If you create separate printable view then it will involve another user action which sometimes user don’t do.

Visual Studio 2010 has finally released and is available for download. You can download various version from below location -

• Visual Studio 2010 – 90 days free trial
  http://www.microsoft.com/visualstudio/en-us/download
• Visual Studio 2010 – Express Editions
  http://www.microsoft.com/express/Downloads/#Visual_Studio_2010_Express_Downloads

There lots of improvement in Visual Studio 2010 over past version. Below are some new great features of Visual Studio 2010 -

Better code intellisense

Visual Studio 2010 has better code intellisense support which make it easier for look for methods and functions. You can now easily search for inline keyword, or even use abbreviation to search for properties or methods.

There are lots of small tricks in .net which can be very useful if used wisely. In this post I want to discuss the use of DebuggerBrowsableAttribute. Using this attribute you can control how a member of class will be displayed in debugger windows during debugging. Before that consider small example:

public class Organization
{
    public List<Employee> Employees
    {
        get;
        set;
    }

    public Organization()
    {
        this.Employees = new List<Employee>();
    }
}

Like the Object oriented programming the exception handling is also not used while coding in JavaScript. That why in most of cases if there is any problem in one part in a page then surprisingly other part also stops working. In this post we will be discussing the various techniques to handle exceptions in JavaScript.

Using try..catch block

try..catch block in JavaScript is very much similar to the regular C# try..catch block. The suspected code will be put in try block and all exceptions which will occur in the try block will be caught in catch block.

window.onload = function()
{
    try
    {
        var x = 90;
        var value = x / y;
    }
    catch(err)
    {
        document.write(err.name + ": " + err.message + "<br/>");
    }
}
Output:
TypeError: 'y' is undefined

In this post I want to cover some very basic and small extension methods which are very useful for any developer. All below mentioned extension method are not doing any complex operation. Rather they are just performing very simple task which you generally encounter a lots of times in your day today coding.

1. IsNull

This is probably most commonly used expression. A lots of places in out code we check to null references. We usually add the obj == null or obj != null check to do this. Here is the IsNull extension method

public static bool IsNull(this object source)
{
    return source == null;
}

Using the you can avoid the lazy null check. Example:

public void ProcessData(DataSet input)
{
    if (!input.IsNull())
    {
        // business logic here
    }
}

Here is business card giveaway for the readers of DailyCoding. The prizes are sponsored by the UPrinting.

1st Prize - 1000 Standard Size Business Cards

2nd Prize - 500 4x6" Postcards

You can choose from any of their stocks for these items. The rules are very simple:

1. Leave a comment (along with your email address) at the end of this post, describing what you would use the free business cards and/or postcards for.
2. Two winners will be chosen based on most interesting comments.
3. There is no fix end date of this contest.
4. Winners in the United States and Canada qualify for free shipping. Shipping fees will apply to winners outside these areas.
   

Vista had come with new and cool look & feel. If you want to add the Vista Aero style theme to you WPF application running on Window XP then it is very easy trick. You don’t need any third party library or tool to achieve this.

To do this all you need to do is to add following lines of xaml code into the designer of your window right after window tag:

<ResourceDictionary Source="/PresentationFramework.Aero, 
   Version=3.0.0.0, Culture=neutral, 
   PublicKeyToken=31bf3856ad364e35, 
   ProcessorArchitecture=MSIL;component/themes/aero.normalcolor.xaml" />

If you want to apply this look through out the application then add this to app.xaml under <Application.Resources> section.

Under “Customized Html Controls” section I will discuss about how to create and customized standard html controls. This is first article in this category. This will discuss about how we can create a custom checkbox using CSS and jQuery.

Checkbox Image

For this you need two images, one for checked state of checkbox and another for unchecked state of the checkbox. However, you can also use a single image containing both checked and unchecked state and use CSS trick like I use.