<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0"
	xmlns:content="http://purl.org/rss/1.0/modules/content/"
	xmlns:wfw="http://wellformedweb.org/CommentAPI/"
	xmlns:dc="http://purl.org/dc/elements/1.1/"
	xmlns:atom="http://www.w3.org/2005/Atom"
	xmlns:sy="http://purl.org/rss/1.0/modules/syndication/"
	xmlns:slash="http://purl.org/rss/1.0/modules/slash/"
	>

<channel>
	<title>おじさんの備忘録-番外編- &#187; javascript</title>
	<atom:link href="http://www.dxcode.com/archives/tag/javascript/feed" rel="self" type="application/rss+xml" />
	<link>http://www.dxcode.com</link>
	<description>個人的なメモ書き</description>
	<lastBuildDate>Fri, 13 Jan 2012 23:57:25 +0000</lastBuildDate>
	<language>ja</language>
	<sy:updatePeriod>hourly</sy:updatePeriod>
	<sy:updateFrequency>1</sy:updateFrequency>
	<generator>http://wordpress.org/?v=3.3</generator>
		<item>
		<title>Layout Changer と Fontsize Switcherを導入</title>
		<link>http://www.dxcode.com/archives/2007/121951.html</link>
		<comments>http://www.dxcode.com/archives/2007/121951.html#comments</comments>
		<pubDate>Tue, 18 Dec 2007 23:19:05 +0000</pubDate>
		<dc:creator>kecha</dc:creator>
				<category><![CDATA[Customize]]></category>
		<category><![CDATA[WordPress]]></category>
		<category><![CDATA[javascript]]></category>
		<category><![CDATA[movabletype]]></category>

		<guid isPermaLink="false">http://www.dxcode.com/archives/2007/121993.php</guid>
		<description><![CDATA[特にLayout Changerが面白そうだったのでFontsize Switcherと併せて導入してみた。 右上にあるLayoutSettingボタンをクリックすると実際に変更できます。 フォントサイズの変更も以前他の [...]]]></description>
			<content:encoded><![CDATA[<p>特にLayout Changerが面白そうだったのでFontsize Switcherと併せて導入してみた。<br />
右上にあるLayoutSettingボタンをクリックすると実際に変更できます。</p>
<p><a href="http://www.dxcode.com/wp-content/uploads/2009/03/layout_changer.gif" title="Layout Changer画面" class="highslide" onclick="return hs.expand(this)"><img src="http://www.dxcode.com/wp-content/uploads/2009/03/layout_changer.thumbnail.gif" alt="Layout Changer画面" width="180" height="300" class="attachment wp-att-607 " /></a></p>
<p>フォントサイズの変更も以前他のCMSで導入した際には文字サイズを変更したスタイルシートをそれぞれ用意してJavaScriptで切り替えるというものだったが、今回はそんな面倒な事をしなくてもサイズ指定さえすればOKだったので手間もかからなかった。</p>
<p>詳しい導入方法は開発元にあります。<br />
Fontsize Switcher&nbsp;»&nbsp;<a href="http://10coin.com/2007/11/05/122816/" title="10coin.com - フォントサイズを切り替えるJS:改2">フォントサイズを切り替えるJS:改2</a><br />
Layout Changer&nbsp;»&nbsp;<a href="http://10coin.com/products/layout-changer/" title="10coin.com - Layout Changer レイアウト変更スクリプト">Layout Changer レイアウト変更スクリプト</a></p>
<p>Layout Changer はWordPressやMovableTypeで非常に人気のあるテンプレート<a href="http://vicuna.jp/" title="CMS TEMPLATE AND SKIN">vicuna</a>専用です。</p>
<p>以下はcss等の個人的なメモ<br />
<span id="more-51"></span><br />
index.php 404.php archive.php category.php page.php search.php single.php<br />
上記７つのテンプレートの&lt;div id=&quot;header&quot;&gt;直下に下記コードを挿入</p>
<pre>
&lt;div class=&quot;functions&quot;&gt;
&lt;script type=&quot;text/javascript&quot; src=&quot;&lt;?php bloginfo(&#039;template_url&#039;); ?&gt;/fontsize-switcher.js&quot;&gt;&lt;/script&gt;
&lt;script type=&quot;text/javascript&quot; src=&quot;&lt;?php bloginfo(&#039;template_url&#039;); ?&gt;/layout-changer.js&quot;&gt;&lt;/script&gt;
&lt;/div&gt;
</pre>
<p>アドレス部分は適宜変更する必要がある。私に場合テンプレートディレクトリ直下に配置したので上記のようにしている。</p>
<p>cssも配布元さんのcssを覗いて拝借しました。 :asease: 表示位置のズレは要調整。</p>
<pre>
div#header ul#fontSizeSwitcher {
	float: left;
	margin: 12px 0 0;
	padding: 0;
	list-style: none;
}

div#header ul#fontSizeSwitcher li {
	margin: 0 0 0 10px;
	padding: 0.2em 3px;
	float: left;
	width: 1em;
	background: #000 url(images/fontsize.gif) left top no-repeat;
	color: white;
	font-size: 100%;
	font-family: Arial, Helvetica, sans-serif;
	font-weight: bold;
	text-align: center;
	cursor: pointer;
}

div#header ul#fontSizeSwitcher li:hover,
div#header ul#fontSizeSwitcher li:focus,
div#header ul#fontSizeSwitcher li.current {
	color: #ff0033;
	background: #fff url(images/fontsize_hover.gif) left top no-repeat;
}

div#header div.functions {
	float: right;
	padding-right:200px;
	margin-top: -103px;
}
</pre>
<p>これで導入は完了したものの他所のサイトでもサイズ切り替えはよく見かけるが、私の場合見づらいからと言って変更する事ってないんですよね。 :tenntenn:</p>
]]></content:encoded>
			<wfw:commentRss>http://www.dxcode.com/archives/2007/121951.html/feed</wfw:commentRss>
		<slash:comments>2</slash:comments>
		</item>
		<item>
		<title>Google Code Prettify for wordpress</title>
		<link>http://www.dxcode.com/archives/2007/102613.html</link>
		<comments>http://www.dxcode.com/archives/2007/102613.html#comments</comments>
		<pubDate>Fri, 26 Oct 2007 14:15:27 +0000</pubDate>
		<dc:creator>kecha</dc:creator>
				<category><![CDATA[Plugin]]></category>
		<category><![CDATA[google]]></category>
		<category><![CDATA[javascript]]></category>
		<category><![CDATA[コード表示]]></category>
		<category><![CDATA[プラグイン]]></category>

		<guid isPermaLink="false">http://www.dxcode.com/archives/2007/102611.php</guid>
		<description><![CDATA[いわゆるコードを色付けして整形し表示してくれるJavaScriptなんですがWordPress用のプラグインがあったのでインストールしてみた。 プラグインを有効にして指定の書式でコードを括れば自動的に判断してくれるので非 [...]]]></description>
			<content:encoded><![CDATA[<p>いわゆるコードを色付けして整形し表示してくれるJavaScriptなんですがWordPress用のプラグインがあったのでインストールしてみた。<br />
プラグインを有効にして指定の書式でコードを括れば自動的に判断してくれるので非常に簡単です。</p>
<p><strong>&lt;pre class=&#8221;prettyprint&#8221;&gt;</strong>ここにコードを書く<strong>&lt;/pre&gt;</strong></p>
<p>PHPの場合</p>
<pre>
ignore_user_abort(true);
define('DOING_CRON', TRUE);
require_once('./wp-config.php');

if ( $_GET['check'] != wp_hash('187425') )
	exit;

if ( get_option('doing_cron') > time() )
	exit;

update_option('doing_cron', time() + 30);

$crons = _get_cron_array();
$keys = array_keys($crons);
</pre>
<p>cssの場合</p>
<pre>h1 {
	margin: 0;
	padding: 0.8em 30px;
	border-top: 1px solid #eee;
	border-bottom: 1px solid #eee;
	color: #666;
	background-color: #f5f5f5;
	font-size: 152%;
	font-weight: normal;
}</pre>
<p>対応している言語は20種類ほどあるみたいです。<br />
若干レンダリングが重たいかな？という感じはしますが私的にはあまり気にならない程度です。</p>
<p>**09.03.12 現在このプラグインは使用しておりませんので表示は異なっています。</p>
]]></content:encoded>
			<wfw:commentRss>http://www.dxcode.com/archives/2007/102613.html/feed</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
	</channel>
</rss>

