Tuesday, December 25, 2012

HTML 5 Footer sticker

0 comments
This is the modern way to create a footer sticker in HTML5 Use the following steps then you can create a "sticky footer". Open your CSS file and paste the following code
html {
    position: relative;
    min-height: 100%;
}
body {
    margin: 0 0 250px; 
/* Margin bottom is the footer height */
}
footer {
    position: absolute;
    left: 0;
    bottom: 0;
    height: 250px;
    width: 100%;
}

The following code is the example of HTML5 site

    


    
    
Lorem ipsum...

Read more...

How to list categories with jquery slide down effect in wordpress

0 comments
Open the wordpress file sidebar.php copy and paste the following code

      
parent ) {
 echo '
  • ' . $cat->name . '
  • '; process_cat_tree( $cat->term_id ); } endforeach; wp_reset_query(); function process_cat_tree( $cat ) { $args = array('category__in' => array( $cat ), 'numberposts' => -1,'orderby'=>'modified'); $cat_posts = get_posts( $args ); if( $cat_posts ) : foreach( $cat_posts as $post ) : echo ''; endforeach; endif; $next = get_categories('hide_empty=0&parent=' . $cat); if( $next ) : foreach( $next as $cat ) : echo '
    • ' . $cat->name . '
    • '; process_cat_tree( $cat->term_id ); endforeach; endif; echo '
    '; } ?>
Next open the header.php in file include the jquery file and add the following code in jQuery
  function jquery_categories_list_animate(clicked_obj){
		 if($(clicked_obj).parent().children('ul').is(':hidden')){
		 
            $(clicked_obj).parent().children('ul').slideDown();
			
        }
        else
        {
			
           $(clicked_obj).parent().children('ul').slideUp();
        }
        $(clicked_obj).toggleClass('expanded');
    }

    $(document).ready(function() {
       
	    
$('li.m1').bind('click', function(){
            jquery_categories_list_animate(this);
			//alert("sdfsdf");
                    return false;
        });

    });



Read more...