<?xml version="1.0" encoding="UTF-8"?><rss version="0.92">
<channel>
	<title>QUOIT Blog &#187; HTML/CSS</title>
	<link>http://ken.quoit.jp</link>
	<description>Programming, OpenSource, HTML/CSS etc...</description>
	<lastBuildDate>Fri, 03 Sep 2010 07:46:05 +0000</lastBuildDate>
	<docs>http://backend.userland.com/rss092</docs>
	<language>ja</language>
	<!-- generator="WordPress/3.0.1" -->

	<item>
		<title>【メモ】WordPressのプレビューが効かなくなったときの対策</title>
		<description><![CDATA[自分のためのメモ。 参考にしたページはこちら。 http://ja.forums.wordpress.org/topic/3053 まず最初に疑うのは、.htaccess。 僕の場合も、.htaccessでDirectoryIndexを指定する作りになってたので、これが原因。 引き継いだ案件は困る要素が盛りだくさんです。。。orz Tweet This! Share this on Facebook Share this on Tumblr Bookmarks this on Hatena Bookmarks Share this on del.icio.us Add this to Google Bookmarks]]></description>
		<link>http://ken.quoit.jp/2010/06/25/%e3%80%90%e3%83%a1%e3%83%a2%e3%80%91wordpress%e3%81%ae%e3%83%97%e3%83%ac%e3%83%93%e3%83%a5%e3%83%bc%e3%81%8c%e5%8a%b9%e3%81%8b%e3%81%aa%e3%81%8f%e3%81%aa%e3%81%a3%e3%81%9f%e3%81%a8%e3%81%8d%e3%81%ae/</link>
			</item>
	<item>
		<title>ボックス内をスクロールすると自動でコンテンツをロードするjQueryをちょっと変えてみた</title>
		<description><![CDATA[ボックス内をスクロールすると自動でコンテンツをロードするjQuery &#8211; かちびと.net を読んで、ちょっとやってみたくなったので作った。 言ってもたいしたことやってませんがｗ かちびと.netのシロさんには許可を頂いてます。 詳細は以下。 上記記事では、下までスクロールしたあとにワンテンポ置いてから（タイマー処理で）コンテンツがロードされる形になってます。 しかし、IEで見てみるとわかるのですが、内側のスクロールが完了した時点で外側のスクロールも動いちゃうんですね。 なので、ロードされる前にページの下に行ってしまう。 これをちょっと改善できないかなーと思って作ったのがこちら。 Auto Scroll Test コードは以下。 &#60;script type=&#8221;text/javascript&#8221;&#62; $(function(){ function updatestatus(){ //ロードしたアイテムの数を表示 var totalItems=$(&#8216;#content p&#8217;).length; $(&#8216;#status&#8217;).text(&#8216;現在、 &#8216;+totalItems+&#8217; 個を表示しています。&#8217;); } function scrollalert(){ var scrolltop=$(&#8216;#scrollbox&#8217;).attr(&#8216;scrollTop&#8217;); var scrollheight=$(&#8216;#scrollbox&#8217;).attr(&#8216;scrollHeight&#8217;); var windowheight=$(&#8216;#scrollbox&#8217;).attr(&#8216;clientHeight&#8217;); var scrolloffset=300; if(scrolltop&#62;=(scrollheight-(windowheight+scrolloffset))) { //新しいアイテムのロード $(&#8216;#status&#8217;).text(&#8216;続きを読み込んでいます・・&#8217;); $.get(&#8216;./hoge.txt&#8217;, &#8221;, function(newitems){ var arr = newitems.split(&#8220;\n&#8221;); for(var i=0;i&#60;arr.length;i++){ $(&#8216;#content&#8217;).append(&#8220;&#60;p&#62;&#8221;+arr[i]+&#8221;&#60;/p&#62;&#8221;); } updatestatus(); }); [...]]]></description>
		<link>http://ken.quoit.jp/2010/05/27/%e3%83%9c%e3%83%83%e3%82%af%e3%82%b9%e5%86%85%e3%82%92%e3%82%b9%e3%82%af%e3%83%ad%e3%83%bc%e3%83%ab%e3%81%99%e3%82%8b%e3%81%a8%e8%87%aa%e5%8b%95%e3%81%a7%e3%82%b3%e3%83%b3%e3%83%86%e3%83%b3%e3%83%84/</link>
			</item>
	<item>
		<title>HTMLメールの是非(2)</title>
		<description><![CDATA[前：HTMLメールの是非(1) HTMLメールは、そのセキュリティの甘さが一般に認識されていないから、まかり通っているのではないか、というお話。 前回一例をあげましたが、他にも危険がいっぱいですよ、という第二回のお話です。 まずはこちらをどうぞ。 ウェブビーコン &#8211; Wikipedia 意味がわからない方は飛ばしていいですｗ じゃあこのウェブビーコン。今でも通用するもんなのでしょうか。 早速このウェブビーコンを仕込んだメールを作ってみました。 …さすがに公開するわけには行きませんがｗ 仕組みとしては、 １）HTMLメールのソースにimgタグを入れる ２）imgタグのsrcで読み込んでるのはPHPファイル。 ３）PHPは何か悪いことをするｗ ってな感じで。 さすがに悪いことをするのはアレなので、アクセスした情報をログファイルに書き出すことにしましたｗ これでどうなるとマズイって、アクセスしちゃってたらマズイわけです。 自分の意図しないプログラムにアクセスしちゃってる＝悪意のあるコードも実行できる っていうことですからね。 で、メーラーで確認。 結果から言うと、アクセスできちゃってました。 PHPは見事にログファイルを吐き出し、自分がアクセスした情報が記録されてしまいました。 （IPアドレスはPHPの置いてあるサーバのIPアドレスでしたが） これ、簡単に怖いこと出来ちゃいますよ。 普通の人はメールのソースなんて見ませんよね。 どうするんですかコレ。 ちなみに、未だにHTMLメールを利用してメルマガを送ってきてるのは、大手だとアマゾンと楽天。 まあ普通に考えて、私は強く思うわけですよ。 アマゾン、楽天は即刻HTMLメールでのメルマガをやめろと。 それとも、大手とされる企業ですから、その危険性を充分にご理解された上で、 マーケティングのために脆弱性を利用されていらっしゃるんでしょうかねえ？ そうだとしたら、犯罪スレスレの行為だと思うんですが、まさか実際やってませんよねえ？ でも、疑われても仕方ないですよ。 そう思われても仕方のない理由がHTMLメールには存在するわけですから。 Tweet This! Share this on Facebook Share this on Tumblr Bookmarks this on Hatena Bookmarks Share this on del.icio.us Add [...]]]></description>
		<link>http://ken.quoit.jp/2010/04/26/html%e3%83%a1%e3%83%bc%e3%83%ab%e3%81%ae%e6%98%af%e9%9d%9e2/</link>
			</item>
	<item>
		<title>HTMLメールの是非(1)</title>
		<description><![CDATA[企業のメルマガなどでよく使われているHTMLメール。 通常のWEBページより制限があるものの、視覚的に訴えやすくなるので、よく使われている。 携帯電話であれば、「デコメ」という名称でHTMLメールのやり取りを出来る機種もある。 だが、セキュリティ的に問題視されている点が多いのも事実。 まぁ知ってる人も多いと思いますが、何が一体問題なのか、ざらっとまとめてみます。 この問題は今に始まったことではなく、だいぶ前から議論されてます。 初めての手順書&#8212;第5回　HTMLメールは使用しない &#8211; ［インターネットセキュリティ］All About 2003年の記事ですね。 HTMLの問題点について解説し、使わない設定にしましょうと促しています。 古い記事だし、今は問題なくなっただろうかというと、そんなことは全然ないです。 例えば上記記事の「プライバシー上の問題」。 具体的にはHTMLメールの中に、送信するユーザ一人一人に対してすべて異なるURLを持つ、サイズ1&#215;1の透明GIF画像へのリンクを書き込んでおくという手法が使われます。 たとえば「hogehoge@usoyonen.com」に対して「123456789.gif」を割り当てておいてアクセスを見張り、「123456789.gif」にアクセスがあれば、「hogehoge@usoyonen.com」を持つユーザがHTMLメールを見たことがわかる、という仕組みです。 （中略） 上記の手法を使った迷惑HTMLメールを開いてしまうとそれだけで、迷惑メールに返信したのと同じ結果になってしまいます。 これは今でも充分可能な手法ですし、問題は何ら改善されていません。 メーラーによって、デフォルトではHTMLメール形式のメールを表示しないようになっていたりしますが、根本的な解決には全くなってません。 じゃあ何でHTMLメールを使うのか。 一番大きい理由は知らないからだと僕は思います。 PCではメールとインターネットだけしかやらない、という人の多くは知らないでしょう。 だからまかり通っているのです。 おかしな話しだと思いませんか…？ （続きます。続きはまた後日） Tweet This! Share this on Facebook Share this on Tumblr Bookmarks this on Hatena Bookmarks Share this on del.icio.us Add this to Google Bookmarks]]></description>
		<link>http://ken.quoit.jp/2010/04/21/html%e3%83%a1%e3%83%bc%e3%83%ab%e3%81%ae%e6%98%af%e9%9d%9e1/</link>
			</item>
	<item>
		<title>WordPressのフィードリンク生成</title>
		<description><![CDATA[このところWordPressをいじる日々が続いたので、備忘録のためにもメモ。 今回はフィードについて。 いつものように、ツッコミお待ちしております。 WordPressのフィードはGETの引数として「?feed=rss」とかつけると取得できます。 このブログであれば、 このブログのRSS http://ken.quoit.jp/?feed=rss これでRSSを取得できますが、カテゴリなどで検索した結果をRSSとして取得したい場合もあります。 その場合も同様に、 このブログの「HTML／CSS」カテゴリのRSS http://ken.quoit.jp/category/htmlcss/?feed=rss こうすればそのカテゴリのRSSを取得できます。 カテゴリなどのURLがGETの引数「?category=htmlcss」になっている場合は、 このブログの「HTML／CSS」カテゴリのRSS http://ken.quoit.jp/category/htmlcss/?category=htmlcss&#38;feed=rss こうやって＆（アンパサンド）で繋げば大丈夫。 とても簡単。 また、「現在表示中のページ」のRSSを出力したい場合は、下記のコードを使えば取得できます。 ※GETの値をチェックするスクリプトは省いています。セキュリティには各自気をつけてください。 &#60;?php $getquery=array(); if($_GET){ foreach($_GET as $k=&#62;$v){ if($k!=&#8221;paged&#8221;){# ページングの引数は除く array_push($getquery,$k.&#8221;=&#8221;.$v); } } } array_push($getquery,&#8221;feed=rss2&#8243;); $getquery=join(&#8220;&#38;&#8221;,$getquery); ?&#62; &#60;a href=&#8221;?&#60;?php echo $getquery; ?&#62;&#8221;&#62;フィードを取得&#60;/a&#62; ＜　追記：20100409 18:10　＞ ついったーで指摘頂きました。@shiroutoSEOさんありがとうございます。 @shiroutoSEOさんの運営されてるかちびと.netにはWordPress関連の貴重な情報がたくさんあります。 WordPress使いは是非見ておくべき！ で、追記。 htaccessでURLを変更している場合には、下記の方法でもフィードを取得できます。 このブログの「HTML／CSS」カテゴリのRSS http://ken.quoit.jp/category/htmlcss/feed/rss/ または このブログの「HTML／CSS」カテゴリのRSS http://ken.quoit.jp/category/htmlcss/feed/ 後述の方法で「/rss/」を省略した場合、RSS1.0が出力されるようです。 ついでに。 RSS2.0を出力する場合は「?feed=rss2」 ATOMフィードの場合は「?feed=atom」 [...]]]></description>
		<link>http://ken.quoit.jp/2010/04/09/wordpress%e3%81%ae%e3%83%95%e3%82%a3%e3%83%bc%e3%83%89%e3%83%aa%e3%83%b3%e3%82%af%e7%94%9f%e6%88%90/</link>
			</item>
	<item>
		<title>【メモ】WordPressのページングについて</title>
		<description><![CDATA[※自分用のメモです WordPressのページングで、最初のページにあえて引数「?paged=1」とつけたいとき。 WordPressのバージョンは 2.9.2。 【wp-includes/link-template.php】 function get_pagenum_link内の1305行目にある if ( $pagenum > 1 ) { $result = add_query_arg( &#8216;paged&#8217;, $pagenum, $base . $request ); } else { $result = $base . $request; } これを $result = add_query_arg( &#8216;paged&#8217;, $pagenum, $base . $request ); こうする。 以上。 Tweet This! Share this on Facebook Share this on Tumblr Bookmarks [...]]]></description>
		<link>http://ken.quoit.jp/2010/04/06/%e3%80%90%e3%83%a1%e3%83%a2%e3%80%91wordpress%e3%81%ae%e3%83%9a%e3%83%bc%e3%82%b8%e3%83%b3%e3%82%b0%e3%81%ab%e3%81%a4%e3%81%84%e3%81%a6/</link>
			</item>
	<item>
		<title>auの携帯電話はパスワードを何と心得るか</title>
		<description><![CDATA[セキュリティについてのことは以前から記事を書いておりましたが、 あまりに驚くことがありましたので、一言申し上げたい。 タイトルが釣りなのは鼻から承知。 携帯サイトの開発の方には既に知れている問題なのかもしれませんが… 気付いたのはユーザからの問い合わせがあったから。 「携帯電話のキャリアを変更したらログインが出来なくなった」というものです。 「以前のメールアドレスとパスワードを入力しようとしたら、パスワードが数字しか入力できないみたいなんですよ」 …え？ そんなバカなことあるかいな、はっはっはと思っていたら そんなバカなことありました。 公式サイトに注目。 KDDI au: 入力フォーム変換仕様 &#62; &#60;input type=&#8221;password&#8221;&#62;/&#60;input type=&#8221;radio&#8221;&#62;/&#60;input type=&#8221;checkbox&#8221;&#62; 簡単に言いますと、 &#60;input type=&#8221;password&#8221; /&#62; ↑これは &#60;ENTRY KEY=&#8221;PASSWD&#8221; FORMAT=&#8221;*N&#8221; NOECHO=&#8221;TRUE&#8221; NAME=&#8221;__card4&#8243;&#62; &#60;ACTION TYPE=&#8221;ACCEPT&#8221; TASK=&#8221;GO&#8221; DEST=&#8221;#__card2&#8243;&#62; PASSWORD: &#60;/ENTRY&#62; ↑こう変換されるんですって。 HDMLっていう、日本ではauだけが採用している記述方法です。 で、何が問題かと言うと、この部分。 &#60;ENTRY KEY=&#8221;PASSWD&#8221; FORMAT=&#8221;*N&#8221; NOECHO=&#8221;TRUE&#8221; NAME=&#8221;__card4&#8243;&#62; 僕はHDML知らないので調べてみました。 EZweb XHTML&#60;input&#62; なになに。「FORMAT=&#8221;*N&#8221;」は数字のみの入力を受け付ける… 待って下さいよ。 なーんでそう変換しちゃったんでしょうかね！？ これはHDMLの仕様が問題なのではなく、 auが &#60;input type=&#8221;password&#8221; /&#62; を勝手に数字のみでいいよねって解釈しちゃったのが問題です。 [...]]]></description>
		<link>http://ken.quoit.jp/2010/02/18/au%e3%81%ae%e6%90%ba%e5%b8%af%e9%9b%bb%e8%a9%b1%e3%81%af%e3%83%91%e3%82%b9%e3%83%af%e3%83%bc%e3%83%89%e3%82%92%e4%bd%95%e3%81%a8%e5%bf%83%e5%be%97%e3%82%8b%e3%81%8b/</link>
			</item>
	<item>
		<title>input fileをCSSでキレイにしたい</title>
		<description><![CDATA[結構この壁にぶつかってる人はいると思います。 textとかsubmitをキレイにしたのに、fileの参照ボタンが…！という思いをした人は多いでしょう。 というか僕がぶつかったので記事を書いているわけですが。 というわけで早速調べてみました。 一番参考になったのはこちらのサイト。 CSS2/DOM &#8211; Styling an input type=&#8221;file&#8221; 英語です。 なので、大事なとこだけ簡単に要約します。 ＜CSS＞ １．&#60;input type=&#8221;file&#8221; /&#62;を「position:relative」で配置した要素（divとか）の中に配置する。 ２．「position:relative」で配置した要素（divとか）の中に子要素（divとか）を配置して、そこに&#60;input /&#62;と&#60;img /&#62;（実際表示されるもの）を入れる。 ３．&#60;input type=&#8221;file&#8221; /&#62;に「z-index:2」「opacity:0」をかける。 ４．おしまい ＜JavaScript＞ ここでJavaScriptが出てくる理由は大きく分けて２つ。 １）CSSの２．で配置した&#60;input /&#62;の中に何にも表示されないので、ファイルのパスファイル名を表示させたい。 ２）設定したCSSがきいてくれない古いブラウザ対応 しかし古いブラウザっていっても、上記サイトで言及されていたのはNetScape3/4とIE4です。 これはもう無視していいレベルと勝手に判断。 ※もしかしたら他のブラウザで問題があるかもなので、自分で調べてください！ なので、ファイルのパスファイル名を表示させる処理だけ加えれば完成ということになりそうですな。 一通り上記の内容をまとめるとこうなります。 ＜HTML＞ &#60;div class=&#8221;fileinputs&#8221;&#62; &#60;input type=&#8221;file&#8221; name=&#8221;img&#8221; /&#62; &#60;div class=&#8221;fakefile&#8221;&#62; &#60;input id=&#8221;targetInput&#8221; /&#62;&#60;img src=&#8221;img/btn-choose-file.jpg&#8221; /&#62; &#60;/div&#62; &#60;/div&#62; ＜CSS＞ div.fileinputs { position: relative; [...]]]></description>
		<link>http://ken.quoit.jp/2009/10/27/input-file%e3%82%92css%e3%81%a7%e3%82%ad%e3%83%ac%e3%82%a4%e3%81%ab%e3%81%97%e3%81%9f%e3%81%84/</link>
			</item>
	<item>
		<title>submitとimageの挙動の違いについて</title>
		<description><![CDATA[twitterの友人のブログ記事を見ていて思い出したこと。 CSSで検索フォームをカスタマイズ ? vanillate とても良い記事なので是非ご覧あれ。 （長くなっちゃったので、覚悟して読んでね！） さて本題。 formタグからデータを送信する方法として、一般的に &#60;input type=&#8221;submit&#8221; value=&#8221;送信&#8221; /&#62; とする方法と &#60;input src=&#8221;hoge.gif&#8221; type=&#8221;image&#8221; value=&#8221;送信&#8221; /&#62; として画像を送信ボタンにする方法がある。 さらにsubmitにはnameタグをつけて、そのデータを取得することが出来る。 例えば。 （※これは乱暴なコードです！決して実際に使おうとか考えないように！） &#60;form action=&#8221;recieve.php&#8221; method=&#8221;post&#8221;&#62; &#60;input name=&#8221;text01&#8243; id=&#8221;text01&#8243; type=&#8221;text&#8221; /&#62; &#60;input id=&#8221;submit_id&#8221; name=&#8221;submit_name&#8221; type=&#8221;submit&#8221; value=&#8221;送信&#8221; /&#62; &#60;/form&#62; このフォームから送信されたデータはこちら。 array(2) { ["text01"]=&#62; string(9) &#8220;テスト&#8221; ["submit_name"]=&#62; string(6) &#8220;送信&#8221; } まぁ、普通ですね。 では次。 フォーム内に複数の送信ボタンがあったらどうでしょう？ 面倒なのでついでに画像の送信ボタンも置いてみました。 &#60;form method=&#8221;post&#8221; action=&#8221;recieve.php&#8221;&#62; &#60;input [...]]]></description>
		<link>http://ken.quoit.jp/2009/10/14/submit%e3%81%a8image%e3%81%ae%e6%8c%99%e5%8b%95%e3%81%ae%e9%81%95%e3%81%84%e3%81%ab%e3%81%a4%e3%81%84%e3%81%a6/</link>
			</item>
	<item>
		<title>WordPressの画像保存場所について</title>
		<description><![CDATA[以前、WordPressでメール投稿　Ktai Entry についてという記事で触れていたのだが、WordPress2.8.4で画像をアップロードした際、wp-content直下に保存されてしまうという問題。 フォーラムに解決策があった。 WP2.6 uploadsディレクトリを変更している場合の画像ファイルのアップロード 私は「設定」＞「その他の設定」で画像のアップロード先を指定できるということを知らなかったので、しちめんどくさい方法を取ってしまっていたと言うわけです。 ここで問題なのは、私はWordPress2.8.4をインストールしてから、上記の設定をいじったことはないということ。 つまり、2.8.4ではデフォルトでwp-content直下に画像が保存される設定になってしまっている？？ （フォーラムの他の記事を詳しく確認していないので、もしかしたらアナウンスされてるのかも） 画像が表示されない方は是非上記設定のご確認を。 Tweet This! Share this on Facebook Share this on Tumblr Bookmarks this on Hatena Bookmarks Share this on del.icio.us Add this to Google Bookmarks]]></description>
		<link>http://ken.quoit.jp/2009/10/06/wordpress%e3%81%ae%e7%94%bb%e5%83%8f%e4%bf%9d%e5%ad%98%e5%a0%b4%e6%89%80%e3%81%ab%e3%81%a4%e3%81%84%e3%81%a6/</link>
			</item>
</channel>
</rss>
