JavaScript - How To Achieve This Jquery Effect?

<?php 
add_action('widgets_init', 'pc_widgets_init');
define('PCAL_CAT', 6);


function pc_widgets_init() {
	register_widget('pc_widget');
}



function get_post_calendar_html(){
global $wp_version;
?>
<style type="text/css">
.wp-calendar{ width:160px;}
.wp-calendar div.calendar {width:100%;}
.wp-calendar caption {
color:#48B05A;
font-weight:bold;
margin-bottom:6px;
padding:0;
text-transform:uppercase;
font-size:.9em;
text-align:left;
}
.wp-calendar tr {margin-bottom:0;}
.wp-calendar td, .wp-calendar th.days {width:26px;height:26px;padding:0;margin:0 1px 1px 0;border:none;}
.wp-calendar td.pad, .wp-calendar th.days {background-color:#eeeee7;}
.wp-calendar th.days {text-align:center;padding-top:6px;height:20px;}
table.mini {margin-right:-1px;}
.wp-calendar td.view-item {margin:0; background-color:#d9d9cd; text-align:center;width:25px;height:20px; padding:6px;}
.wp-calendar td.view-item a {text-align:center;padding-top:6px;color:#333;font-weight:bold;}
.wp-calendar td.today {background-color:#48b05a;}
.wp-calendar td.today a {color:#fff;}
</style>
<script type="text/javascript">
function pcal_prev(){
	if(jQuery(".wp-calendar:visible").length > 1){
		jQuery(".wp-calendar:visible:first").slideUp('slow');
		jQuery(".wp-calendar:visible:last").next('.wp-calendar:hidden:first').show('slow');
	}
}
function pcal_next(){
	if(jQuery(".wp-calendar:visible:first").prev('.wp-calendar:hidden').length){
		jQuery(".wp-calendar:visible:last").hide('slow');
		jQuery(".wp-calendar:visible:first").prev('.wp-calendar:hidden:last').show('slow');
	}
}
</script>

<span class="calendar_nav_bar"><a onclick="pcal_next()">&lt;&mdash;</a> <span><?php echo $browse; ?></span>
<a onclick="pcal_prev()">&mdash;&gt;</a>
</span>
<?php
	pcal_get_posts();
	
}

function pcal_get_posts(){
global $wpdb, $wp_locale;

	$thisyear = gmdate('Y', current_time('timestamp'));
	$thismonth = gmdate('m', current_time('timestamp'));

	$lastmonth = $thismonth-1;
	$lastyear = $thisyear;

	if($thismonth == -1){
		$lastmonth = 12;
		$lastyear -=1;
	}

	get_post_calendar($thismonth,$thisyear);
	

	// Get months this year and next with at least one post
	$future = $wpdb->get_results("SELECT
		DISTINCT MONTH(post_date) AS month, YEAR(post_date) AS year
		FROM $wpdb->posts
		WHERE post_date <='$lastyear-".($lastmonth+1)."-01'
		AND post_type = 'post' AND post_status = 'publish'
		ORDER	BY post_date DESC");
	$x= 0; //Hide counter, after the first one, it will disappear
	foreach($future as $now){
		
		get_post_calendar($now->month,$now->year,$x);
		$x++;
	}
}


// Calendar Output...
function get_post_calendar( $thismonth ='', $thisyear='', $hide=0) {
	global $wpdb, $timedifference, $wp_locale;
	$unixmonth = mktime(0, 0 , 0, $thismonth, 1, $thisyear);

	// week_begins = 0 stands for Sunday
	$week_begins = intval(get_option('start_of_week'));
	$add_hours = intval(get_option('gmt_offset'));
	$add_minutes = intval(60 * (get_option('gmt_offset') - $add_hours));


	if($hide)
		$style = "display:none;";
	echo '<table class="wp-calendar" style="'.$style.'">
	<caption>' . $wp_locale->get_month($thismonth) . ' ' . $thisyear . '</caption>
	<thead>
	<tr>';

	$myweek = array();

	for ( $wdcount=0; $wdcount<=6; $wdcount++ ) {
		$myweek[] = $wp_locale->get_weekday(($wdcount+$week_begins)%7);
	}
	foreach ( $myweek as $wd ) {
		$day_name = (true == $initial) ? $wp_locale->get_weekday_initial($wd) : $wp_locale->get_weekday_abbrev($wd);
		echo "\n\t\t<th abbr=\"$wd\" scope=\"col\" class='days' title=\"$wd\">$day_name</th>";
	}

	echo '
	</tr>
	</thead>
	<tbody>
	<tr>';

	// Get days with posts
	$dayswithposts = $wpdb->get_results("SELECT DISTINCT DAYOFMONTH(post_date)
		FROM $wpdb->posts
		LEFT JOIN $wpdb->term_relationships AS trel ON ($wpdb->posts.ID = trel.object_id) LEFT JOIN $wpdb->term_taxonomy AS ttax ON ( trel.term_taxonomy_id = ttax.term_taxonomy_id) LEFT JOIN $wpdb->terms AS tter ON (ttax.term_id = tter.term_id) WHERE MONTH(post_date) = '$thismonth'
		AND YEAR(post_date) = '$thisyear'
		AND post_type = 'post' AND post_status = 'publish'"
		."AND post_type = 'post' AND post_status = 'publish' AND ( ttax.taxonomy = 'category' AND $wpdb->posts.ID = trel.object_id AND trel.term_taxonomy_id = ttax.term_taxonomy_id AND ttax.term_id = tter.term_id AND tter.term_id = '".PCAL_CAT."')", ARRAY_N);
	if ( $dayswithposts ) {
		foreach ( $dayswithposts as $daywith ) {
			$daywithpost[] = $daywith[0];
		}
	} else {
		$daywithpost = array();
	}


	if ( strstr($_SERVER['HTTP_USER_AGENT'], 'MSIE') || strstr(strtolower($_SERVER['HTTP_USER_AGENT']), 'camino') || strstr(strtolower($_SERVER['HTTP_USER_AGENT']), 'safari') )
		$ak_title_separator = "\n";
	else
		$ak_title_separator = ', ';

	$ak_titles_for_day = array();
    //sets the Density Thermometer
	$ak_posts_for_day = array();

	$ak_post_titles = $wpdb->get_results("SELECT ID, post_title, DAYOFMONTH(post_date) as dom "
		."FROM $wpdb->posts 
		LEFT JOIN $wpdb->term_relationships AS trel ON ($wpdb->posts.ID = trel.object_id) LEFT JOIN $wpdb->term_taxonomy AS ttax ON ( trel.term_taxonomy_id = ttax.term_taxonomy_id) LEFT JOIN $wpdb->terms AS tter ON (ttax.term_id = tter.term_id) "
		."WHERE YEAR(post_date) = '$thisyear' "
		."AND MONTH(post_date) = '$thismonth' "
		."AND post_type = 'post' AND post_status = 'publish' AND ( ttax.taxonomy = 'category' AND $wpdb->posts.ID = trel.object_id AND trel.term_taxonomy_id = ttax.term_taxonomy_id AND ttax.term_id = tter.term_id AND tter.term_id = '".PCAL_CAT."')"
	);
// print_r($wpdb);
	if ( $ak_post_titles ) {
		foreach ( $ak_post_titles as $ak_post_title ) {
				if ( empty($ak_titles_for_day['day_'.$ak_post_title->dom]) )
					$ak_titles_for_day['day_'.$ak_post_title->dom]['title'] = '';
				if ( empty($ak_titles_for_day["$ak_post_title->dom"]) ){ // first one
					$ak_titles_for_day["$ak_post_title->dom"]['title'] = str_replace('"', '&quot;', wptexturize($ak_post_title->post_title));
					$ak_titles_for_day["$ak_post_title->dom"]['id'] =$ak_post_title->ID;
				}else{
					$ak_titles_for_day["$ak_post_title->dom"]['title'] .= $ak_title_separator . str_replace('"', '&quot;', wptexturize($ak_post_title->post_title));
				}
                $ak_posts_for_day["$ak_post_title->dom"] +=1;

		}
	}

	// See how much we should pad in the beginning
	$pad = calendar_week_mod(date('w', $unixmonth)-$week_begins);
	if ( 0 != $pad ) { echo "\n\t\t".'<td colspan="'.$pad.'" class="pad">&nbsp;</td>'; }

	$daysinmonth = intval(date('t', $unixmonth));
	for ( $day = 1; $day <= $daysinmonth; ++$day ) {
		if ( isset($newrow) && $newrow )
			echo "\n\t</tr>\n\t<tr>\n\t\t";
		$newrow = false;

		if ( $day == gmdate('j', (time() + (get_option('gmt_offset') * 3600))) && $thismonth == gmdate('m', time()+(get_option('gmt_offset') * 3600)) && $thisyear == gmdate('Y', time()+(get_option('gmt_offset') * 3600)) ){
			echo '<td class="today  view-item">'.'<span>'.$day.'</span>';
		}elseif(in_array($day, $daywithpost)){

			echo '<td class="haspost view-item">';
			echo '<a href="'.get_permalink($ak_titles_for_day[$day]['id'] ).'" title="'.$ak_titles_for_day[$day]['title'].'" '.$onclick1.' >'.$day.'</a>';
		}else{
			echo '<td class="view-item">'.'<span>'.$day.'</span>';
		}
        // any posts on that day?
		if ( in_array($day, $daywithpost) ) {
            //Outputs the Density Thermometer along with the day...
			

		} else {
			
		}

		echo '</td>';

		if ( 6 == calendar_week_mod(date('w', mktime(0, 0 , 0, $thismonth, $day, $thisyear))-$week_begins) )
			$newrow = true;
	}

	$pad = 7 - calendar_week_mod(date('w', mktime(0, 0 , 0, $thismonth, $day, $thisyear))-$week_begins);
	if ( $pad != 0 && $pad != 7 )
		echo "\n\t\t".'<td class="pad" colspan="'.$pad.'">&nbsp;</td>';

	echo "\n\t</tr>\n\t</tbody>\n\t</table>";
}


/*Add Dashboard Widget via function wp_add_dashboard_widget()*/
function pc_setup_dashboard_widget() {
    wp_add_dashboard_widget( 'pc_add_dashboard_widget', __( 'Posts Calendar' ), 'pc_add_dashboard_widget' );
}

function pc_add_dashboard_widget(){
	pcal_getposts(0);
}


class pc_widget extends WP_Widget {

	function pc_widget() {

		$widget_ops = array('classname' => 'pc_widget', 'description' => __( "Show your blog's Future Posts in the sidebar.") );
		echo $this->WP_Widget('pc_widget', __('Posts Calendar Sidebar'), $widget_ops);
	}


	function update( $new_instance, $old_instance ) {
		$instance = $old_instance;
		$instance['title'] = strip_tags($new_instance['title']);
		$instance['browse'] = strip_tags($new_instance['browse']);
		$this->flush_widget_cache();

		$alloptions = wp_cache_get( 'alloptions', 'options' );
		if ( isset($alloptions['pc_widget']) )
			delete_option('pc_widget');

		return $instance;
	}

	function flush_widget_cache() {
		wp_cache_delete('pc_widget', 'widget');
	}

	function form( $instance ) {
		$title = isset($instance['title']) ? esc_attr($instance['title']) : '';
		$title = isset($instance['browse']) ? esc_attr($instance['browse']) : '';
?>

		<p><label for="<?php echo $this->get_field_id('title'); ?>"><?php _e('Title'); ?></label>
		<input type="text" name="<?php echo $this->get_field_name('title'); ?> id="<?php echo $this->get_field_id('title'); ?>" value="<?php echo $title;?>">

		<p><label for="<?php echo $this->get_field_id('browse'); ?>"><?php _e('"Browse Post" text'); ?></label>
		<input type="text" name="<?php echo $this->get_field_name('browse'); ?> id="<?php echo $this->get_field_id('browse'); ?>" value="<?php echo $browse;?>">
		</p>
<?php
	}

	function widget($args, $instance) {
		global $wpdb;

		$cache = wp_cache_get('pc_widget', 'widget');

		if ( !is_array($cache) )
			$cache = array();

		if ( isset($cache[$args['widget_id']]) ) {
			echo $cache[$args['widget_id']];
			return;
		}

		ob_start();
		extract($args);

		$title = apply_filters('widget_title', empty($instance['title']) ? __('Scheduled Posts') : $instance['title']);	$browse =  empty($instance['browse']) ? __('Browse Posts') : $instance['browse'];
?>
		<?php echo $before_widget; ?>
		<?php echo $before_title; ?><?php if ( $title ) echo $title; ?><?php echo $after_title; ?>
		<div id="pc">
			<?php get_post_calendar_html();?>
		</div>
		<?php echo $after_widget; ?>
<?php

		$cache[$args['widget_id']] = ob_get_flush();

		wp_cache_add('pc_widget', $cache, 'widget');
	}



}


?>

var hash = window.location.hash.substr(1);
	var href = $('.workimg a').each(function(){
		var href = $(this).attr('href');
		if(hash==href.substr(0,href.length-5)){
			var toLoad = hash+'.html #selected';
			$('#selected').load(toLoad)
		}											
	});

	$('.workimg a').click(function(){
								  
		var toLoad = $(this).attr('href')+' #selected';
		$('#selected').slideUp('slow',loadContent);
		$('#load').remove();
		$('#wrapper').append('<span id="load">LOADING...</span>');
		$('#load').fadeIn('normal');
		window.location.hash = $(this).attr('href');
		function loadContent() {
			$('#selected').load(toLoad,'',showNewContent)
		}
		function showNewContent() {
			$('#selected').slideDown('slow',hideLoader);
		}
		function hideLoader() {
			$('#load').slideUp('slow');
		}
		return false;
		
	});