ITORIAN BLOG

In this quick code you will learn how to flip or rotate image with transition effect using CSS. We will have opportunity to trigger the flip or rotate action on mouse hover or click, for this we will be using jQuery.

In this quick code you will learn how to create expandable or toggle drop down menu with little icon which shows menu is opened or not. Let's straight look at working example below.

Recently I had a requirement to create a multi-branch tree view menu for website which should be completely CSS based and no single line of JS code.

In this post we are going to talk about LESS and its introduction, coding, compilation and features available in Visual Studio Editor with Web Essential extension. Before talking about anything let’s understand what is LESS and how it can help developers.

In this article you will learn how to create image sprite using Visual Studio Web Essential Extension. Suppose you have a website that uses lots of images and each image loads individually which increases number of requests and makes website slow. We need quick website optimization to fix it.

In this article you will learn how to paste clipboard image onto Visual Studio Editor. Like we can paste clipboard image in MS-Word, it is possible to paste in Visual Studio Editor with the help of Web Essential Visual Studio Extension.

In this article you will learn about Image Optimization using Web Essential Visual Studio extension. You will learn how we can optimize individual image by right clicking on image file, how to optimize group of images in the folder, how to optimize image in CSS file and how to optimize Base64 Encode Image (dataUri) in CSS file.

In this article you will learn about Base64 Encode Image, why we encode image and how it can improve website performance. We are going to make use of Web Essential which is a must have Visual Studio extension.

If you remember, CSS2 added support for the media="screen" way of defining which stylesheet to use for which representation of the data. Now CSS3 added a new feature to this functionality, by adding media queries. Basically, this means you can change stylesheets or styles on the web page based on for instance the width and height of the viewport/browser.

In this post I would like to share my strategies for web performance optimization and speeding up website, here's my list with tools or technologies I use: 1. Code minification and bundling By this process we remove comments and extra spaces as well as crunch variable names in order to minimize code. Code minification applies to CSS, JavaScript or HTML codes and code bundling applies to CSS and JavaScript codes, in some cases we bundle HTML codes also. If you use Visual Studio, then it has an extension Bundler & Minifier (by  Mads Kristensen) this tool can easily bundle and minify codes inside IDE. You can configure this extension for automatic bundling on build as well as you can use this to manually select files and then bundle and minify. Another way with Visual Studio web applications which I like the most, is by using bundling and minification NuGet packages, this automatically bundles and minifies when you publishing project in release mode. There...

Bundling and minification are two new techniques introduced with ASP.NET 4.5 Beta to improve request load time.   It improves load time by reducing the number of requests to the server and reducing the size of requested assets (such as CSS and JavaScript).

Last weak, two Telerikers Joshua Holt and Carl Bergenhem introduced a very nice free e-book for developer community to get job done quickly with less code. Very nice book, read it once.

In this post you will learn how to get started with jQuery UI. Believe me, jQuery UI is really very easy to learn and it provides abstractions for low-level interaction and animation, advanced effects and high-level, theme-able widgets, built on top of the jQuery JavaScript Library which you can use to build highly interactive web applications. The whole jQuery UI categorized into three groups that is core, interactions, widgets and effects. In this post I am going show you how to setup a demo page for jQuery UI. You just need to follow the steps given below. Step 1 (Downloading UI Library) At very first you need to download the jQuery UI library from here http://jqueryui.com/download . You might get confused on this download page because there is various checkboxes to select. Look if you want to download library that contains core elements of UI then deselect all components and select only UI Core there. Similarly, if you want library that contains interaction element...

Introduction This post shows how to make the clone of elements on web page using jQuery, for this we will use .clone() method. Sometimes we want to copy (clone) elements on web page, for example, navigate menu can be placed on header and footer too and there may be many situations come to us where we need to clone. Why write something twice if we have opportunity to use jQuery. So, let's create a demonstration page for this talk. < body >     < h2 > History of Visual Studio </ h2 >     < div class ="mainBody">         Visual Studio's history probably begins in < strong class ="year"> 1975 </ strong > with Bill and Paul's decision to create Altair BASIC.  Maybe you could start before that but I think that's as far back as you could go and still say it's about Visual Studio at all – it's at that time that Microsoft decided it was going to have software de...

Introduction Download I this quick post you will learn how to move any tag in DOM using jQuery. Firstly, I will show you a problem and then I will talk on its fixes. Here's a problem: My friend has designed a web page that has following information inside <body> tag. He is actually novice in web. < body >     < div style =" width : 500px ; text-align : justify ; ">         < h2 > History of Visual Studio </ h2 >         < div class ="mainBodyInfos">             < div class ="CopyrightInfo">                 Copyright © 2009-2012 ITORIAN. All rights reserved.             </ div >          ...