If you’d like to learn how to use Git, check out my top 10 favorite Git tutorials for beginners. At the end, you’ll also see a list of other educational Git resources.

Complete Article Here

Despite the face that the HTML5 specification won’t officially be finished until 2022, a lot of designers are already diving into the parts of HTML5 that currently have support in modern browsers.

HTML5 opens up some whole new avenues for web design and web application development, things that were previously only possible with either JavaScript or Flash.

Here we’ve rounded up 175 resources for learning HTML5. Included below are tutorials, frameworks, examples, and a lot

Complete Article here

Complete Article here

unserialize(): Error at offset

The reason of this error is corruption in “, ‘, :, & ; characters.

Quick Solution

the solution is 2 step based.

1. While serializing the variable encode it with base64 encoding.

   base64_encode(serialize($data))

2. While unserializing the variable decode the serialized variable using base64 encoding.

   unserialize(base64_decode($data))

WordPress for Designer: Day 13

Get ready to jump straight into WordPress coding as we continue on with our WordPress for Designers series. As suggested by many of our readers, we will go straight into wordpress and begin coding our theme. Today, we will cover a basic WordPress reset, as well as begin coding our home page. Start your servers, launch your text editor, and lets go!

Want to see tutorial in full screen mode, Click Here

Today i am releasing my own build widget enabled wordpress theme for free under creative common license. this HTML Template is originally created by Solucija, i love its simplicity and my mind said why not i convert it in a wordpress template so here is the wordpress template just unzip it in your template folder and done.

Click Here To Download

Today i am going to release my own build jquery context menu.

Download : jQuery Very Simple Context Menu Plugin

Their is 3 important file you need to include in your application

1) vscontext.jquery.js (Context Menu Logic File).
2) vscontext.css (Context Menu CSS File).
3) A file which store your click function written on your menu items href attribute, (here i am using menu_action.js).

How to build context menu

Step 1 : Include files

1) jquery.js
2) vscontext.jquery.js
3) menu_action.js (can use your own file name which have menu items action functions)
4) css/vscontext.css

Step 2 : Create area where you want to build context menu.


<div id="context">This is the testing block.</div>

Step 3 : Build Menu item list with action code


<div class="vs-context-menu">


<ul>

<li class=”cut seprator”><a href=”javascript:cut();” id=”menu_1″>Cut</a></li>

<li class=”copy”><a href=”javascript:copy();” id=”menu_2″>Copy</a></li>

<li class=”paste seprator”><a href=”javascript:paste();” id=”menu_3″>Paste</a></li>

<li class=”edit”><a href=”javascript:edit();” id=”menu_4″>Edit</a></li>

<li class=”delete”><a href=”javascript:del();” id=”menu_5″>Delete</a></li>

</ul>

</div>

Step 4 : Build ContextMenu Code


<script type="text/javascript">

$(document).ready(function(){

$(‘#context’).vscontext({menuBlock: ‘vs-context-menu’});

});

</script>

Where #context is the id of div from step – 2.
AND vs-context-menu is the class name from step – 3.

Today, i am representing my own build jquery tooltip, it is very easy to use and build on very simple logic so that you can further modify its code. use it in your project for free, if you like it or have any suggestions / comments , or you have some idea to make it better, or you need some more fetures in it then pls just drop a comment in the same post.

Download : jQuery Tooltip Plugin

Version 3.0 : Now use separate div tag to store tooltip data on same page.

DEMO : Using separate div tag.

How to use

1) include jquery, and tooltip.jquery.js files in your web page.

2) Javascript

$(document).ready(function(){
$('.tooltip').tooltip();
});

Avilable Options with default values

To use multiple option you need to seprate every option from “,”.

3) Tooltip

<a id="tooltip_from_div" href="javascript;" class="tooltip">Tooltip without
static file</a>

4) Tooltip data div

<div id="data_tooltip_from_div" style="display:none;">this is developed by
hidden div.</div>

whats important in that
the div tag which store the tooltip data should have id the in the following manner
‘data’ + ‘_the id on which the tooltip develop’
In above example the id of tooltip is ‘tooltip_from_div’ then the id of div which store that tooltips data will be ‘data_tooltip_from_div’.

Finish

Now Version 1.1 Realsed : No need to create static file to store tooltip notification data.

DEMO : Without using static file.

How to use

1) include jquery, and tooltip.jquery.js files in your web page.

2) Javascript

$(document).ready(function(){
$('.tooltip').tooltip();
});

3) HTML

<a id="This tooltip is developed by using this html tags id attribute
>Tooltip without static file</a>

Finish

DEMO : Using static file

How to use

1) include jquery, and tooltip.jquery.js files in your web page.

2) Javascript

$(document).ready(function(){
$('.tooltip').tooltip({
folderurl : 'contents/'
});
});

3) HTML

<a id="tooltip_1" href=";">Testing no 1 </a>

4) Tooltip Contents

now you need to write content which will be shown mouse hover on above link, the plugin search the file which is mentioned in “id” attribute of link (currently ‘tooltip_1′) in the specified folder location (javascript: ‘folderurl’), by default the file extention is txt, so the file name will become like this contents/tooltip_1.txt

Finish

In this screencast, I’ll show you how to create a “Center” plugin, using jQuery, that will force an image to stay vertically and horizontally center on the screen – even when the browser is resized.

Want to see tutorial in full screen mode, Click Here

WordPress for Designers: Day 12
It’s time to move on to Day 12 of WordPress for Designers. We are very close to jumping in to our WordPress coding, but before we do so, we need to slice out those images. Today, we will have an in depth look at using the slice tool with our .psd to pull out any images needed to complete our theme. WordPress theme here we come!

Want to see tutorial in full screen mode, Click Here