kawama.jp

Google ReaderからFeedlyへの移行時に設定すべきたったひとつのこと(Android用)

カテゴリ: スマホ・android — タグ: , — 2013年6月27日 22:16 — Comments (0)hatebu count

フォントを変えましょう。

デフォルトのフォントだと、こんな感じです。

feedlyフォント設定1

何か変です。タイトルが表示されていないので、この状態だとほとんど使いものになりません。

Advanced Settingsからフォントを「Sans Serif」に変更します。(Sol、Robotoでも大丈夫っぽいです)

feedlyフォント設定2

するとこのようにタイトルが表示されるようになります。

feedlyフォント設定3

これでマトモに使えるようになりました。

Google Readerとそれほど変わらない操作性です。このままFeedlyを使っていこうと思います。

text-decorationを親要素と子要素両方に指定すると

カテゴリ: CSS — タグ: — 2013年6月25日 22:58 — Comments (0)hatebu count

親要素には効くけど、子要素には効きません。

↓こういうコードを書いたら

<span style="text-decoration:underline;">親要素のspan<span style="text-decoration:none;">子要素のspan</span>親要素のspan</span>

↓こうなって欲しいところですが、

親要素のspan子要素のspan親要素のspan

↓実際はこうなります。

親要素のspan子要素のspan親要素のspan

そういう仕様になってるとのことです。

参考ページ
http://www.mozilla.gr.jp/standards/webtips0002.html

Android4.0でブラウザのキャッシュを削除

カテゴリ: スマホ・android — タグ: — 2013年6月17日 11:39 — Comments (0)hatebu count

ブラウザ開く
 ↓
メニューボタンをタップ
 ↓
設定
 ↓
プライバシーとセキュリティ
 ↓
キャッシュを消去

mod_pagespeedをインストールしてみた

カテゴリ: Apache,サーバー — タグ: , — 2013年6月14日 09:58 — Comments (1)hatebu count

してみました。

Apacheのモジュールで、導入するとページの表示が劇的に早くなるということです。

インストールについてはこちらのページを参考にさせていただきました。
http://d.hatena.ne.jp/eco31/20101119/1290157894

$ sudo yum install at
$ wget https://dl-ssl.google.com/dl/linux/direct/mod-pagespeed-stable_current_x86_64.rpm
$ sudo rpm -U mod-pagespeed-stable_current_x86_64.rpm
$ sudo /sbin/service httpd restart

3行目のところでwarningが出ましたが、インストール自体は問題ないようです。
warning: mod-pagespeed-stable_current_x86_64.rpm: Header V4 DSA signature: NOKEY, key ID .....

Apache再起動して確認したところ、なんとなくページの表示が早くなったような感じが。

とりあえずしばらく様子を見てみようと思います。

Youtube埋め込みプレーヤーでシークバーを表示する/隠す

カテゴリ: 技術関連 — タグ: — 2013年6月12日 21:23 — Comments (0)hatebu count

autohideのパラメーターを使います。

autohide=0:シークバー(とコントロールバー)が常時表示される(デフォルト)
autohide=1:マウスカーソルを乗せてるときだけシークバー(とコントロールバー)が表示される

autohide=0

<iframe width="400" height="225" src="http://www.youtube.com/embed/2Iiy_YfpVn0?autohide=0" frameborder="0" allowfullscreen></iframe>

autohide=1

<iframe width="400" height="225" src="http://www.youtube.com/embed/2Iiy_YfpVn0?autohide=1" frameborder="0" allowfullscreen></iframe>

ie8でyoutube埋め込みプレーヤーのバグ

カテゴリ: Ajax,JavaScript — 2013年5月28日 21:06 — Comments (1)hatebu count

youtube埋め込みプレーヤー(iframe)を操作するとie8のみ画面が真っ暗になる、という不具合に遭遇しました。
ie8のみのバグみたいです。

対処法はこちらのページを参考にさせてもらいました。
http://blog.romeolynx.com/article/52365723.html

サンプル作ってみました。
ie8で「消す」のボタンをクリックすると画面が真っ黒になります。
「消す2」のほうはバグ回避してるので普通に消えます。


<script>
function deleteIframe() { $('#youtube_wrapper div').replaceWith("<span>iframeを消した</span>"); }
function deleteIframe2() { $('#youtube_wrapper iframe').attr('src',''); $('#youtube_wrapper div').replaceWith("<span>iframeを消した2</span>"); }
</script>

<div id="youtube_wrapper" style="padding:20px;width:240px;height:180px;background-color:yellow;">
  <div>
    <iframe id="player" width="240" height="180" src="http://www.youtube.com/embed/2Iiy_YfpVn0?enablejsapi=1&playerapiid=ytplayer" frameborder="0" allowfullscreen></iframe>
  </div>
</div>

<button type="button" onclick="deleteIframe();">消す</button>
<button type="button" onclick="deleteIframe2();">消す2</button>

phpでxmlの名前空間を取得する

カテゴリ: PHP — タグ: , , , , — 2013年5月20日 17:31 — Comments (0)hatebu count

まず最初に名前空間とは。

<item>
<title>タイトル</title>
<link>http://www.example.com/</link>
<description>説明</description>
<pubDate>yyyy/mm/dd</pubDate>
<media:content url="http://www.example.com/path/to/jpg/hoge.jpg" type="image/jpeg" height="743" width="1024"/>
</item>

太字の部分が名前空間。htmlで言うとタグの属性に似てます。

phpのsimplexml_load_file関数はとても便利で、

$xml = "http://www.example.com/path/to/rss/hoge.rss";
$data = simplexml_load_file($xml);

こんな風にするだけで簡単にxmlを解析してphpオブジェクトに変換してくれます。

ただこれだけだと名前空間部分はスルーされてしまいます。

名前空間に欲しい情報がある場合、例えばこの例では

$data->children("media", true)->content->attributes()->url;

という感じでようやく取得できます。

非常に面倒ですが、とりあえずこのやり方で取得できます。

参考ページ
http://blog.mach3.jp/2010/12/various-xml-on-php.html

テーマのテスト表示ができるプラグイン「Theme Test Drive」

カテゴリ: 技術関連 — タグ: — 12:14 — Comments (0)hatebu count

WordPressでテーマを編集する場合、ローカルに同じ環境を作ったりしてやってたんですが、「Theme Test Drive」というプラグインがあるのを知ってさっそく試してみました。

Theme Test Drive:http://wordpress.org/extend/plugins/theme-test-drive/

Test Drive用のテーマを1つ割り当てることができ、管理者ログインしてるとそのテーマで表示、一般ユーザーにはデフォルトのテーマが適用される、というものです。便利です。

使い方はこのあたりのページを参考にさせてもらいました。
http://lifehacking.jp/2012/07/wp-theme-test-drive/
http://kinomemo.info/create/1025/

phpで送信するメールが勝手に1000バイト目あたりで改行される

カテゴリ: PHP — タグ: , — 2013年5月17日 21:53 — Comments (0)hatebu count

ということがあって、そのせいで文字化けしたり、レイアウトが崩れたりということがありました。

調べてみたところphp側の問題ではなく、MTAで勝手に改行を入れている様子。

http://alley.way-nifty.com/han/2005/09/outlook_express_cda5.html

http://www.geek.sc/archives/743

そもそもメールというものは適宜改行を入れて書くものであって、1行に1000バイト以上書いてはいけない、という決まりになってるそうです。まだメモリが高価で容量が少なかった時の名残だそうです。

面倒ですけど1000バイトの手間で改行を入れてやるしかなさそうです。

cssの:before、:afterがけっこう便利

カテゴリ: Ajax,JavaScript,CSS — タグ: , , — 2013年5月15日 22:26 — Comments (0)hatebu count

今更ながらその便利さに気が付きました。

<style type="text/css">
.before_after_test1:before { content: "("; }
.before_after_test1:after { content: ")"; }
.before_after_test2:before { content: "[ "; }
.before_after_test2:after { content: " ]"; }
</style>

<div class="before_after_test1">カッコ1</div>
<div class="before_after_test2">カッコ2</div>

↑こうすると

↓こうなります

カッコ1
カッコ2

・ ・ ・

こんなことも

<style type="text/css">
.before_after_on:before { content: "スイッチオン:"; }
.before_after_off:before { content: "スイッチオフ:"; }
</style>

<div class="before_after_test3 before_after_off" style="text-decoration:underline;color:blue;cursor:pointer;">ここをクリック</div>

<script type="text/javascript">
$(function(){
$('.before_after_test3').click(function(){ $(this).toggleClass('before_after_on').toggleClass('before_after_off'); });
});
</script>

ここをクリック

うまく使えばきれいなコードが書けると思います。

Copyright (C) 2002 - 2017 kawama All Rights Reserved. — Powered by WordPress