Tech Rocks


An online resource for latest web technologies like Coldfusion, JRun, Pro*C, JQuery, HTML5, PHP, W3C, Java, J2EE, C, C++, ORACLE, PL/SQL, MySql, Ajax, Coldbox, Fusebox, UNIX, JavaScript, NodeJS and much more...

Saturday, July 23, 2011

Blogger Archive Decoded

See the recursion in the include of intervalaa
 b:section class='sidebarqq' id='sidebarqq' preferred='yes'
b:widget id='xxx' locked='false' title='Blog Archive' type='BlogArchive'
b:includable id='intervalaa' var='intervalData'
b:loop values='data:intervalData' var='i'
span      /spanul
span      /spanlia expr:href='data:i.url' span ( /span
span       /spanb:if cond=''
span        /spanb:include data='' name='intervalaa'/
span       /span/b:if
span      /span/li
span     /span/ul

b:includable id='main'
div class='widget-content'
span     /spandiv id='ArchiveList'
span      /spandiv expr:id='data:widget.instanceId + "_ArchiveList"'
span       /spanb:if cond='data:style == "HIERARCHY"'
span        /spandiv class="menunav"
span        /spanb:include data='data' name='intervalaa'/
span        /span/div
span       /span/b:if
span      /span/div
span     /span/div

Wednesday, July 20, 2011

QTip2 JQuery Plugin

Cool Tooltip here

Find the source files here

CSS Dropdown Menu

 #cssdropdown, #cssdropdown ul { list-style: none; }
 #cssdropdown, #cssdropdown * { padding: 0; margin: 0; list-style: none; }
 #cssdropdown li.headlink {
  width: 165px;
  float: left;
  margin-left: -1px;
  border: 1px black solid;
  text-align: center;
 #cssdropdown li.headlink a { display: block; padding:0; text-decoration: none; }

 #cssdropdown li.headlink ul { display: none; border-top: 1px black solid; text-align: left; }
 #cssdropdown li.headlink:hover ul { display: block; }
 #cssdropdown li.headlink ul li a { padding: 0; height: 17px; }
 #cssdropdown li.headlink ul li a:hover { background-color: #333; }
 #cssdropdown a { color: white; } #cssdropdown ul li a:hover { text-decoration: none; }
 #cssdropdown li.headlink {
 #cssdropdown li.headlink:hover {
 #cssdropdown li.headlink ul {
 #cssdropdown li.headlink a {
 #cssdropdown li.headlink ul li a {
  border-top:solid 1px #000000;
 #cssdropdown li.headlink ul li a.first {
 #cssdropdown {
  position:absolute; top:0; left:0;
  $('#cssdropdown li.headlink').hover(
   function() { $('ul', this).css('display', 'block'); },
   function() { $('ul', this).css('display', 'none');
<table width="1000" border="1" cellpadding="0" cellspacing="0">
  <td><div style="position:relative;">
    <ul id="cssdropdown">
     <li class="headlink"> <a href="#">Home</a> </li>
     <li class="headlink"><a href="#">Archive 2008</a>
       <li><a href="#" class="first">Archive 2008</a></li>
       <li><a href="#">Archive 2009</a></li>
       <li><a href="#">Archive 2010</a></li>
       <li><a href="#">Archive 2011</a></li>
       <li><a href="#">Posts Atom</a></li>
     <li class="headlink"><a href="#">Archive 2009</a></li>
     <li class="headlink"><a href="#">Archive 2010</a></li>
     <li class="headlink"><a href="#">Archive 2011</a></li>
     <li class="headlink"><a href="#">Posts Atom</a></li>
  <td height="100" bgcolor="#FFFFFF">Content</td>

Saturday, July 16, 2011

What is HTML5 Video

Check these links

Link1: What is HTML5 Video,
Link2: An annotate plugin for html5 audio and video,
Link3: list of HTML5 Video Players.

Wednesday, July 13, 2011

Geo Location with GeoPlugin

See the link here for more details

Also see the JQuery Version here

See also Geo Location with Google Maps here

Sample Code:
 <script src=""></script>
 document.write("Welcome to our visitors from "+geoplugin_city()+", "+geoplugin_countryName()+geoplugin_countryCode());

Monday, July 11, 2011

Theme an entire site with JQuery UI

Click here for an example

JQuery UI DropDown

Why you shouldn’t style select boxes look here

Technorati Tags: ,,,,

Check out this link for nice CSS Dropdown

Also this link here has more details.

Wiki Documentation here

Saturday, July 9, 2011

Google Search for Site and InTitle

See the following example: intitle:jeetu

CSS Gradient

 .orangeGradientVertical {
      background: #FFE27C; /* Old browsers */
      background: -moz-linear-gradient(top, #FFE27C 0%, #ffd83b 100%); /* FF3.6+ */
      background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#FFE27C), color-stop(100%,#ffd83b)); /* Chrome,Safari4+ */
      background: -webkit-linear-gradient(top, #FFE27C 0%,#ffd83b 100%); /* Chrome10+,Safari5.1+ */
      background: -o-linear-gradient(top, #FFE27C 0%,#ffd83b 100%); /* Opera11.10+ */
      background: -ms-linear-gradient(top, #FFE27C 0%,#ffd83b 100%); /* IE10+ */
      filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#FFE27C', endColorstr='#ffd83b',GradientType=0 ); /* IE6-9 */
      background: linear-gradient(top, #FFE27C 0%,#ffd83b 100%); /* W3C */

Friday, July 8, 2011

Box-Shadow in CSS3

#example1 {
-moz-box-shadow: 10px 10px 5px #888;
-webkit-box-shadow: 10px 10px 5px #888;
box-shadow: 10px 10px 5px #888;