Awasome 3D Transaction Social Widget on Mosue Hover..!!!

         Hi guys after a long time ..May be a month I am once again back with New and Effective CSS3 Widgets !!!.. This is also one of the Widget which Join's the Category of "My Own Creation"  ..

           I am Very Much Exited to post or share this Widget.. Because this is my most favourite widget with awasome css3 transactions effect..Thanks to "Codrops" for sharing CSS3 Hover Effect Tutorials ..Which Inspited me to make this widget...

           Take A look at it..How it Looks.. Live Demo

          This Widget has Two Versions.. One is colored and other is Non-Colored Version. Only with color code this two varies.. You can also change the Colors According to your Wish or Your Template..You can use our Blog's "HTML Modifier or Editor" to edit HTML and CSS and for Color Codes you can try Our Blog's "Hexadecimal Color Code Generator"...

OK!! Let's Begin as Usual..


How To Add This Widget This your Blog: 

• Login to your "Blogger Account" and Go to your Blog "Dashboard"...
• Now Go to "Layout Section" from your "Dashboard"...
• Now Click On "Add Gadget" and Select "HTML/Java Script"...
• Now Copy and Paste the Below Given Set of Codes in it...

<link rel="stylesheet" href="https://googledrive.com/host/0B_7JWdEqBhVVdk11eHpTT0xyd28"/>

<div class="maincont">
<div class="container">
<section class="main">
<ul class="ch-grid">
<li>
<div class="ch-item">              
<div class="ch-info">
<div class="ch-info-front ch-img-1"></div>
<div class="ch-info-backfb">
<h3>Facebook</h3>
<p>Like Our Page .:MJN Tech:.<a href="http://facebook.com/mjntech">Like us On Facebook</a></p>
</div>  
</div>
</div>
</li>
 <li>
 <div class="ch-item">
<div class="ch-info">
<div class="ch-info-front ch-img-2"></div>
<div class="ch-info-backgp">
 <h3>Google+</h3>
<p>Add Us To your Circle<a href="https://plus.google.com/117524639868275216387">Add Us On Google+</a></p>
 </div>
 </div>
</div>
</li>
<li>
<div class="ch-item">
<div class="ch-info">
<div class="ch-info-front ch-img-3"></div>
<div class="ch-info-backtw">
<h3>Twitter</h3>
<p>Join Us on Twitter<a href="http://twitter.com/manjunathg17">Follow Us on Twitter</a></p>
</div>
</div>
 </div>
</li>
 </ul>
</section></div>
</div>

• Add The Title As you wish and Click Save!!!!!!!!

That's it all Done...

Customization: 

Now Replace Links Text Highlighted in Color Facebook,Twitter,Google+ with your Link..

Useful Note:

• You can Also  Edit this Widget like Width,Colour etc using HTML Editor of our Blog   : HTML Editor..
• You can Use Hexadecimal Color Code  Generator of our Blog to Replace Colors  : HexaDecimal Color Code Generator..

Important Note:

• You Can Comment If any Problem Persist.. or Need Help With This Widget..
• Any Query or Help Related to this or any other related to Blogger Feel Free to Contact Us..
  Within 24 to 48 hours we will get your back the answer for your Question.. .

I hope you all liked and Enjoyed the post..

Join our Facebook Fan Page  .:MJN Tech:.

and

Subscribe for More Latest Updates..

With Regard's

 Manjunath.G..