Unparsed preformatted HTML

							JAST
				

					Get Started
					
Download
					
Word word word See bla bla bla
					$(selector).children().each(function(){
					var val = $(this).outerWidth(); 
					w.push(val);
					});							
				
						

The Javascript

						(function ( $ ) {
						
							$.fn.prettyPre = function (){
								var preEl = $(this);
								for (var i = 0; i < preEl.length; i++)
								{	
									var content = $(preEl[i]).html().replace(/[<>]/g, function(m) { return {'<':'&lt;','>':'&gt;'}[m]});						
									var tabs_to_remove = '';
									while (content.indexOf('\t') == '0')
									{
									  tabs_to_remove += '\t';
									  content = content.substring(1);
									}
									var re = new RegExp('\n' + tabs_to_remove, 'g');
									content = content.replace(re, '\n');              
									$(preEl[i]).html(content);
									}	
								};
						
						}( jQuery ));
					

The CSS

						.pretty-pre {
							padding-top:20px;
							overflow: hidden;
							width: 70%;
							transition: width 0.9s;
							}
							
						.pretty-pre.expand:hover {
							position: relative;
							width: 100%;
							z-index: 99;
							transition: width 0.9s;
							}	
					

Call the plug-in

Call the function after jQuery and before the end of body.

						<script src="js/prettypre.jquery.js"></script>
						<script>$(document).ready(function(){
							$('.pretty-pre').prettyPre();
							});
						</script>	
					

Parsed strings

Add the class .pretty-pre to the pre elements you want to parse with the script.

Plus: the class .expand resizes the element on mouse over.

							JAST
							

								Get Started
								
Download
								
Word word word See bla bla bla
								$(selector).children().each(function(){
								var val = $(this).outerWidth(); 
								w.push(val);
								});							
							
						

							
							function sample($foo, $obj = null) {
								foreach($foo as $k=>$v){
								echo $v[$obj];	
								}
							var_dump($foo);
							}