Panel - Code view

//** Previews button click
//**
$('.wiz-prev', panel).click(function(){
	var prev_state = current_state;
	
	if (current_state>1) { prev_state--;  }
	
	if (current_state!=prev_state){
		var nt_width = ((prev_state-1)*105)+'px';
		
		$('.pbar .done',panel).animate( {'width':nt_width},350,'easeInOutExpo', function (){
			$('.pbar',panel).removeClass('ct-step-'+current_state);
			$('.pbar',panel).addClass('ct-step-'+prev_state);
			
			$('.progress>.step-'+prev_state).addClass('selected').removeClass('on');
			$('.progress>.step-'+current_state).addClass('off').removeClass('selected').removeClass('on');
			
			current_state--;
		});
		
		$('.label', panel).removeClass('selected');
		$('.label:eq('+(prev_state-1)+')', panel).addClass('selected');				
		
		changeWizardStep(prev_state, panel);
	}
	return false;
});
			
<div class="panel">
	<div class="title-large">
		<h3>
			Panel - Code view
			<span>Show formated source code</span>
		</h3>
		<ul class="tabs-box clearfix"> 
			<li><a href="#" rel="code-view-html">HTML</a></li>
			<li class="selected"><a rel="code-view-css" href="#">CSS</a></li>
			<li><a href="#" rel="code-view-js">Javascript</a></li>
			<li><a href="#" rel="code-view-php">PHP</a></li>
			<li><a href="#" rel="code-view-sql">MySQL</a></li>
		</ul>
		<div class="search-box">
			<input type="text" name="search" value="Type your keyword here" />
			<a href="#"></a>
		</div>
		
	</div>
		
	<div class="content">
		** some content here ***
	</div>
</div>
				
SELECT dienst.dienst, dienst.url, dienst.info, dienst_prijs.dienst_eenheid, dienst_prijs.prijs 
CASE dienst_prijs.prijs 
WHEN dienst_prijs.prijs = '0.00' THEN 1000 
WHEN dienst_prijs.prijs > '0.00' THEN 10 
ELSE NULL
END AS orderme 
FROM dienst, dienst_prijs 
WHERE dienst.taal = 'nl' &&
dienst.dienst_type = 'Internet toegang' && 
dienst.dienst != 'alle diensten' && 
dienst.publiceer != '' && 
dienst_prijs.dienst_eenheid IN ( 'maand', 'jaar' ) && 
dienst.dienst = dienst_prijs.dienst 
ORDER BY orderme, dienst_prijs.prijs
				
/** Generate the actual widget content.
 *	Just finds the instance and calls widget().
 *	Do NOT over-ride this function. */
function display_callback( $args, $widget_args = 1 ) {
	if ( is_numeric($widget_args) )
		$widget_args = array( 'number' => $widget_args );

	$widget_args = wp_parse_args( $widget_args, array( 'number' => -1 ) );
	$this->_set( $widget_args['number'] );
	$instance = $this->get_settings();

	if ( array_key_exists( $this->number, $instance ) ) {
		$instance = $instance[$this->number];
		// filters the widget's settings, return false to stop displaying the widget
		$instance = apply_filters('widget_display_callback', $instance, $this, $args);
		if ( false !== $instance )
			$this->widget($args, $instance);
	}
}
				
/******** Calendar rules *******/
.calendar-nav a.next { 
	background-position:right top;text-align:right;padding-right:18px; }
	
.calendar-nav a.next:focus { 
	outline:none; 
	}
.calendar-nav a.next:link { 
	}
.calendar-nav a.next:visited { 
	}
.calendar-nav a.next:hover { 
	background-position:right center;color:#8f8f8f; }
.calendar-nav a.next:active { 
	background-position:right bottom;color:#686868; }
.calendar-nav a.back { 
	background-position:left top;text-align:left;padding-left:18px;}
.calendar-nav a.back:focus { 
	outline:none; }
.calendar-nav a.back:link { 
	}
.calendar-nav a.back:visited { 
	}
.calendar-nav a.back:hover { 
	background-position:left center;color:#8f8f8f; }
.calendar-nav a.back:active { 
	background-position:left bottom;color:#686868; }