うわ！見やすい！長いソースコードをじっくり見るのにいい！Fullscreen API！ : actyway

// ※ ソーシャルてんこ盛りのコードを端折って表示しています
(function(){
	var url = location.href,
	tenkomori = document.createElement('div');
	tenkomori.id = 'tenkomori';
	tenkomori.innerHTML += '<div class="social-buttons">'+
 
	/* 閉じる */
	'<div onclick="document.body.removeChild(document.body.firstChild);" style="height:16px;width:60px;background-color:#009fff;color:white;text-align:center;font-size:10px;top:-10px;left:330px;line-height:1;padding:4px 0 0 0;position:absolute;cursor:pointer;">閉じる</div>'+
 
	/* hatebu */
	'<a href="http://b.hatena.ne.jp/entry/" class="hatena-bookmark-button" data-hatena-bookmark-layout="vertical" title="このエントリーをはてなブックマークに追加"><img src="http://b.st-hatena.com/images/entry-button/button-only.gif" alt="このエントリーをはてなブックマークに追加" width="20" height="20" style="border:none;" /></a> '+
 
	/* twitter */
	'<a href="https://twitter.com/share" class="twitter-share-button" data-count="vertical" data-lang="ja">ツイート</a> '+
 
	/* facebook */
	'<iframe src="//www.facebook.com/plugins/like.php?href='+encodeURI(url)+'&amp;send=false&amp;layout=box_count&amp;width=70&amp;show_faces=false&amp;action=like&amp;colorscheme=light&amp;height=62" scrolling="no" frameborder="0" style="border:none;overflow:hidden;height:62px;width:70px;" allowTransparency="true"></iframe> '+
 
	/* googleplus */
	'<g:plusone size="tall" href="'+url+'"></g:plusone> '+
 
	/* evernote */
	'<a href="#" onclick="Evernote.doClip({}); return false;"><img src="http://static.evernote.com/article-clipper-vert.png" alt="Clip to Evernote" /></a> '+
 
	/* tumblr. */
	'<a href="http://www.tumblr.com/share" title="Share on Tumblr"><img src="http://actyway.com/bookmarklet/tumblr.png" alt="Clip to Evernote" /></a>'+
 
	'</div><div id="page-tweets"></div>'+
	'<style>'+
	'#tenkomori{position:fixed;z-index:10000;top:10px;right:10px;width:400px;height:300px;border:solid 6px #009fff;border-radius:5px;box-shadow:black 1px 1px 8px;background:#d9efff url(http://actyway.com/bookmarklet/stripe.png);font-size:13px;font-family:sans-serif;color:#4f4f4f;text-align:left;padding:0;margin:0;}'+
	'#tenkomori a img{border:none;}'+
	'#tenkomori .social-buttons{margin:0;padding:15px 12px;height:68px;}'+
	'#page-tweets{height:202px;overflow-y:auto;overflow-x:hidden;margin:0;padding:0;}'+
	'.t-partition{background-color:white;border-radius:3px;padding:7px 10px;margin:0 12px 15px 12px;box-shadow:#afafaf 1px 1px 2px;}'+
	'.t-author{zoom:1;height:32px;margin:0 0 10px 0;line-height:16px;padding:0;font-size:10px;}'+
	'.t-author:after{content:"";display:block;clear:both;}'+
	'.t-photo_url{float:left;margin:0 7px 0 0;}'+
	'.t-nick{font-size:12px;color:#009fff;}'+
	'.t-content{padding:0;margin:0;line-height:17px;}'+
	'.t-date{color:#afafaf;font-size:10px;}'+
	'.t-more{text-align:center;}'+
	'iframe.twitter-share-button{height:62px !important;}'+
	'</style>';
	document.body.insertBefore(tenkomori,document.body.firstChild);
})();

<div class="wp_syntax">
	<table>
		<tr>
			<td class="line_numbers">
				＜pre＞1＜/pre＞
			</td>
			<td class="code">
				＜pre class="html4strict"＞<!-- ここにソースコードが表示される -->＜/pre＞
			</td>
		</tr>
	</table>
</div>

.wp_syntax::after {
	content: "※ダブルクリックでフルスクリーンモードになるかも？！ESCキーで解除";
	display: block;
	font-size: 11px;
	padding-left: 25px;
}