jPlayer : HTML5 Audio & Video for jQuery
オーディオだけじゃなくビデオも再生できるjQueryのプラグイン。
htmlとcssがわかればある程度好きなように見栄えをカスタマイズできて
プレイリストっていうのかな、複数の曲の連続再生に対応してる。

.mp3を.oggに変換する

うちの設置方法がよくないのか、firefoxではmp3が再生できなかった。

firefoxのaudioタグがmp3をサポートしていないからなのかな
とりあえず.mp3を.oggに変換する事に。

Audio Sound File Converter Software. Convert wav mp3 dvd midi flac dvf wma etc.というアプリ（無料）が簡単だった。

ファイルをドラッグして形式を選んでコンバート押すだけ。

.ogg以外にも様々な形式に書き出せる。

こないだ変換に使ったアプリなんだったけな？と忘れちゃったのでメモ投稿。

Lion 復元ディスクアシスタント

http://support.apple.com/kb/DL1433?viewlocale=ja_JP

1GBくらい

command+Yで
ストーリーエディタとレイアウトを切り替えられる。

経緯

inDesignで長文を編集したり確認したりする時は
ストーリーエディタが便利かもしれん、と思いながら使い始めてみた。

しばらくして「字形で選択した異体字」が「通常の漢字」のまま表示されている事に気づく。
ストーリーエディタ上で異字体に変換するも、表示は通常の漢字のまま（異体字が表示される文字もあったけど、今回の文字は表示されなかった）。

実際のレイアウト上ではどうなっているのかな？と確認しようとしたけど
ストーリーエディタで選択した部分をレイアウト側で即座に見る方法がわからず
レイアウト側で文章を追っていって確認。

これだと非常に面倒だ、なにか選択した部分をビシっと表示させる方法があるはずだ
とメニューを見ていたら、ストーリーエディタからレイアウトと切り替えを発見。

command+Yで
ストーリーエディタとレイアウトを切り替えると
カーソルの位置が反映されてた。

ストーリーエディタからレイアウトに戻る時は
レイアウト側をクリックしていて
なんでストーリーエディタが見えなくなっちゃうんだろうと思っていたんだけど
切り替えて使うものなのね、これ。

で、ゲストユーザが消えた。

1つ目はDiffMerge
SourceGear | DiffMerge | overview

インストールして
dreamweaverで環境設定（command + U）
ファイルの比較 – 参照
Macintosh HD:usr:bin:diffmerge

（アプリケーションのdiffmergeを選択するわけじゃなのね・・・）

こんな感じ

ただ初期設定のままだと日本語が化けるらしいので
以下のサイトを参考に設定。
「DiffMerge」で日本語テキストを正しく表示させる方法 – 強火で進め

2つ目はTextWrangler
Bare Bones Software | Download TextWrangler
こっちは「ファイルの比較 – 参照」が
Macintosh HD:usr:local:bin:twdiff
だった。

C押して起動して（Intel ベースの Mac で利用できる起動時のキーコンビネーション）
ユーティリティからMacintosh HDを修復して戻ってきたら

MAMPのMySQLが起動しなくった（Hosterも起動しなくなってた）。
再インストールしようかと思ったんですけど
とりあえず検索してみたら

MAMPでMySQLが起動しなくなった場合 | HATO BLOG
を発見。

MAMP Forum • View topic – Error: Could not connect to MySQL server!

MAMPを起動してターミナルから

killall -9 mysqld

でうちの環境でもMySQLを起動させられるようになりました。
というメモ

hosterは再インストールした。

本当は、購入してからいままで
どんな設定をして何をインストールしたかなんてのを
あーだこーだ壁にぶつかる度にメモを残したかったのだけれど
時間がない事を理由にやってこんかった。

そしたらもうほどんど何をしてきたのか忘れてるので
慌ててメモっていきたいと思います。

設定（順不同）

ファンクションキーを使えるように

［システム環境設定 – キーボード］から
標準のファンクションキーとして使用にチェックを入れた

ライブラリを表示させる

Finderの移動をoption押しながら開くとライブラリが見える、それをよく使う項目にドラッグしておいた。
参考 / [N] 「Mac OS X Lion」ユーザライブラリのフォルダを表示する方法2

Application SupportとかFontsとか弄りたい時があるんです。

.htaccessなどをローカルで表示作成出来るようにする

以下のアプリを使うと簡単に設定出来るよ
TinkerTool: Description

こんな感じ

windowsの alt + tab みたいにウインドウ毎で切り替えたい

macのcommand + TABはアプリケーション毎の切り替えなんですよね。

しかしWindowFlowを使うと
option + TABでalt+tabのように窓を切り替えられるようになりました。
でも今はほとんどMissionControlでやりくりして使わなくなったけど。

基本操作で困ったこと

adobeのphotoshopなんかで拡大縮小したい時

command + spaceとやると「入力文字の切り替え」になってしまうが
space（を先に押してから）+ commandすると「入力文字の切り替え」がでてこないよ。

メモリ増設

最初のメモリ4GBだと同時に色々やるのがキツかったので、
4GB×2枚セットのメモリをamazonで購入して8GBに増設、
しかしまだまだモッサリ。

どうもMacBook Pro 17インチ Late2011はSandy Bridgeなので、
メモリを16GBまで増設出来るらしい（公式にはmax8GB）。
というわけで8GB×2枚セットが10000円近くまで下がった時にamazonで購入。

16GBすげぇ快適。

8GBに増設する時に、誤ってHDD交換用のドライバーを購入してしまい
メモリ届いたけどMacが開けられん！事態になり
急遽ダイソーの精密ドライバーを買ってきてMacを開けたんだけど
予想以上に使いづらかったので、
16GBに増設する時は何度も確認してちゃんと使える精密ドライバーも一緒に買った。
200円ちょい。

[編集中]

Cyberduckでアクセスしてみると
一応それっぽいファイルが存在してた、文字化けしてなんだかわからないけど
FileZillaで見た時より文字化けしてるファイルの数があきらかに多い。

Macではゲットできないのかな？困ったな、と思っていたら
文字コードを変更することで表示させてゲットする事ができた、というメモ。あーいぇー

使うアプリ（2個+1）

MAMP / apacheとMySQLにPHPを簡単インストール

MAMP: Mac, Apache, MySQL, PHP

hoster / hostsの設定が楽チンになるアプリ

RedWinder::MacApp::Hoster

エディター / CotEditor使った

CotEditor プロジェクト日本語トップページ – SourceForge.JP

手順（うろ覚えだけど）

1）MAMPの変更

MAMP PROは使わないからアンインストールした
アプリケーション フォルダのMAMP PROの中にあるUninstaller.appで
全部チェックした。

MAMPのポートを:8888から:80に変更した

2）httpd.confの書き換え

httpd.confをCotEditorで開けるように、cmd+iから変更

httpd.confの場所は

/Applications/MAMP/conf/apache/httpd.conf

次の行を検索して

#AddType text/html .shtml
#AddOutputFilter INCLUDES .shtml

#（コメントアウト）を削除して .htmlを追加

AddType text/html .shtml .html
AddOutputFilter INCLUDES .shtml .html

次に、

Options Indexes FollowSymLinks

で検索して

<Directory />
    Options Indexes FollowSymLinks
    AllowOverride None
</Directory>

に”ExecCGI Includes”（CGIとSSIの使用を許可）を追加

こんな感じになる。

<Directory />
    Options Indexes FollowSymLinks ExecCGI Includes
    AllowOverride None
</Directory>

3）httpd-vhosts.confの編集

/Applications/MAMP/conf/apache/extra/httpd-vhosts.conf

winのxamppだとNameVirtualHost *:80がコメントアウトされてたけど
MAMPはされてなかった。

一番下に追加
DocumentRootにフォルダの場所
ServerNameに任意のアドレス

<VirtualHost *:80>
  DocumentRoot "/Users/［ユーザー名］/_webroot/example"
  ServerName _example.localhost
  <Directory "/Users/［ユーザー名］/_webroot/example">
    order deny,allow
    allow from all
  </Directory>
</VirtualHost>

4）hosterを起動

ホスト名に「_example.localhost」
IPに「127.0.0.1」を追加

こんなの追加されたらおk

127.0.0.1 _example.localhost

以上MAMPを再起動して動作チェック

バーチャルホストを増やす時は
3）と4）をそれぞれ編集。

以上で漏れはないかな？

人生初のMacをがいきなり初期不良で
HDDとキーボードが壊れていたり
散々なMac人生のスタートでしたが
結果的に素敵な出来事もあり
なんとかマカーを続けられそうです。

さて、時間も無いので細かいことは
またいづれ書くとして

スクロール方向を個別に設定したい

うちが今使ってるのはLionで、その前はよくわからんのだけれど
トラックパッドはiOSの挙動で
マウスホイールは今までの動きにしたいと思ったです。

でもトラックパッドとホイールの設定は裏でつながってるらしくて
ナチュラルかそうでないかどっちかになってしまうのですね。

それを別々にするアプリがありました。

Scroll Reverser for Mac OS X

素敵。

いやしかしMac難しい。
もうさっぱりです

アプリのインストールとか、開きっぱなしのアプリとか
ようわからんです。
でも楽しい。

プリセットマネージャーからでもポップアップする。

1）新規でドキュメントを作成して
なんでもいいから適当にブラシで描画
それをコピーして

2）ブラシが使えないドキュメントにペーストすると
ブラシが使えるようになる。

アップロード速くて良い感じ

ファイル転送サービス : up300.net β版
7日間保存できて、30回ダウンロードしたらおしまい。
容量が300MBまでだったのが500MBまで増えた。

<div class=”margin300px”>
でも実際のcssには
margin:500pxって書いてある
cssみたいな名前だなぁと思った。

ダウンロードする画面はこんな感じ
ファイル転送サービス : up300.net β

box.netの方はいろんなところで見かけるので知ってる人ばかりだと思うけどメモ

App Store – Box.net
2011年12月2日まで、無料アプリをダウンロードして登録するかログインすれば
使える容量が50GBからになる（通常5GB）。

アップロードはiPhoneからだと画像しかアップしかあげられなかった
何年も前からそうみたいだけど、そのうち動画をアップできたりするようになるのかな？

ちなみにフォルダも作れない。
PCでアップした日本語のテキストが文字化けしてた（文字コードの関係？）

誰かがダウンロードしたら登録したメールアドレスへ通知が来るっぽい（てか、きた）。

それよりなにより便利だなぁと思ったのはWebDAV対応。

windows7だとこんな感じで使える、超簡単

フォルダーに

http://box.net/dav

といれて登録したidとpassでログイン

ちょっともたつく感じが否めないけど
簡単に使えてそれなりに速くて便利だと思った。

表示：[自由に並び替え][日付順][完了したタスク][ゴミ箱]

どこに消えちゃうのか分からないかったから
完了済みってリストを作って
いちいちそこにぶっこんでました。

戻す時は
「完了したタスク」に入ってるもののチェックを外す。

メモ

tasksは、ほとんどchromeの
New Tab to Tasksこれで立ちあげてる
新しいタブを立ちあげたら（ctrl+T）
タスクが表示されるので。

firefoxはgoogleツールバーにタスクのボタンがあるので特に何も入れてない

うちはWP Social Bookmarking Light « WordPress Pluginsを使っているので
[設定 - wp social bookmarking light]
の
facebookタブを開いて
Locale:en_US を
Locale:ja_JP に変更して保存。

プラグインを使っていない場合も
en_USをja_JPに変更するだけ。
というメモ。

is_page('スラッグ')

if文をこんな感じに書いてるけど
「｝」の為に?phpって書くの面倒くさい。
シンプルにできないものかな。

<?php
if(is_page('スラッグ')){
?>
スラッグだった時の処理
<?php
}
?>

条件分岐タグ – WordPress Codex 日本語版

WordPressをカスタマイズするなら絶対覚えておきたい条件分岐やカスタム投稿タイプなどいろいろ

関数：WordPress私的マニュアル

分岐は大体is_なんちゃらなのかしら。

こっちは出力する場合
ページスラッグを出力する方法 | Lovelog+*

それをキャンセルするツールに
マウスチャタリングキャンセラ（現在v2.1）てのがあるので
入れてみた。

マウスチャタリングキャンセラの詳細情報 : Vector ソフトを探す！

開きたくないファイルを開いたり
選択範囲を上手く作れなかったり
マウスを買い換えないで解消できるかしら？

しばらく様子見。

ところで次出るのはiPhone5じゃなくて4Sみたいね。
国内は10月14日発売とか

速報：アップル " Let’s talk iPhone " イベント — Engadget Japanese
機種変更もその日に出来るのかなぁ。

これavastのアドオンが悪さしてるみたい。
avast! WebRepってのを無効化して再起動したら
コメントに

ウェブ評価
全体の評価

がついてこなくなった

日々、エロとのっちと格言名言lifehackやオサレ風写真とたまにwebの事をリブログするばかりの
生粋のリブロガーなので（オリジナルポスト5%くらい）
tumblr以外は特に稼働していないのだけれど

リブロガーたるもの自分の言葉で何かを語る事は、はばかれる為
悶々としたものはtwitterに流します。
悶々としてないものも流します。

そうすっとtwitterからはmixiとgreeに飛んでいくので無責任な生存確認になってるようなならないような。

うちの中心はtumblr

リブログしてるだけでお金が貰えたらなーなんてことを考えるくらい
気分転換にポチポチしてます

それを支えるのはFirefoxと
tombloo

そして今は
tomblooにgoogle+に投稿出来るパッチをインストールして
（参考:Firefox用アドオン「Tombloo」にGoogle+への投稿を追加する方法｜いちの日記（チラシの裏））
polygonplanet/tombloo – GitHub

以下のページを参考に
（参考:これはすごい！Google＋でエクステンションを使わずにFacebook・Twitter・Evernoteへ同時投稿する裏技 | Chrome Life）
dlvr.itにgoogle+のfeedを登録して
twitterとfacebookに飛ばした

ゴミをまき散らしてるだけな気がするけど
もうちょっと続けてみる。

[追記]
思うようにコントロール出来なかったから
dlvr.itを使うのやめた
こえーこえー

当たり前だけどこんな風に出来無いわけですよね

$("this ul").addClass("hogehoge");

childrenを使うといいみたい。

$(this).children("ul")

親にはparent

$(this).parent()

参考 / まよねこ inside » Blog Archive » 【jQuery】thisの親や子要素の指定方法[リライト版]

宿題
ひろし+すみれのliからから友蔵+こたけのliを指定するにはどうしたらいいんだろうか。

<h1>さくら家</h1>
<ul>
<li><span class="name">友蔵+こたけ</span>
<ul>
<li><span class="name">ひろし+すみれ</span>
<ul>
<li class="name">さきこ</li>
<li class="name">まるこ</li>
</ul>
</li>
</ul>
</li>
</ul>

を追加するとふきだしを消せるみたい。

そのまま

大きな地図で見る

iframeに&iwloc=Bを追加

大きな地図で見る

以前は、ふきだしを消してソースをコピペしたら非表示になってたのにねぇ。

ベーシック認証をかけたい時に
サーバーのフルパスが分からなくて困る人間なのでメモ

ちなみに、以下のページで.htaccessと.htpasswdを簡単に作れる。
.htaccess ファイルを簡単作成「.htaccess Editor」

firebugを見上がら、なんだっけなーこれって思ってたけど
reset.cssのimgの指定がこうなってた

img{border:0;}

なのでvertical-align:bottom;を追加してみたら隙間が消えた。

img{border:0;vertical-align:bottom;}

昔、vertical-align:bottom;を指定してたと思うのだけれど、
なんで今入ってないんだろう
何か理由があって削除したのかな？

思い出せない

Telegraphics – Free plugins for Photoshop & Illustrator…and other software

ページ下部からプラグインをdlして

windowsならここらへんにぶっ込む。

C:\Program Files (x86)\Adobe\Photoshop CS\Plug-Ins\File Formats.

C:\Program Files\Adobe\Adobe Photoshop CS4 (64 Bit)\Plug-ins\File Formats.

windows7 64bitでも
photoshopの32bitならWindows (32 bit)を使う。

初めていわれた。

fireworksでも

ファイルを開けませんでした。
ファイルタイプが不明です。

と言われて開けなかった。

解決法

ペイントで開いて別名保存した
jpgで保存したら、ブロックノイズが乗りまくったのでpngにした。

忙しくってアウトプットする時間を作れない。
色々あるのに忘れてしまう。

材料

• カタクチイワシ
• 塩
• オリーブオイル

背黒イワシ = カタクチイワシ

カタクチイワシは売ってなかったが背黒イワシがあった
検索してみると背黒イワシはカタクチイワシの別名らしい、魚の名前は複雑ね。

日本では古くから食用に供されてきたため、地方ごとに様々な別名をもつ。ヒシコイワシ、シコ、シコイワシ、田作り（タヅクリ）、五万米（ゴマメ）、背黒鰯（セグロイワシ）、狼鰯（オオカミイワシ）、脹眼（ハンガン）、金山（カナヤマ）、丸（マル）、ヒラレ、泥目（ドロメ）、ドロイワシ、ママゴ、エタレ、クロタレ、シラス、タレクチ、チリメン、タレ、ホオタレ、ホホタレ、ホウタレ、ブト、コシナガ、カエリ、カクハリなど、多種多様な呼び名がある。

カタクチイワシ – Wikipedia

頭、内蔵、大骨、尾を切り落とす

初めてやるけどそれっぽい形になった。

とりあえず全部やる

キッチンペーパーで水気を切って
塩を敷いたタッパに並べた

重ねて塩をまぶして重ねての繰り返し

ここから冷蔵庫で一ヶ月

んー、本当にこれでいいのかなぁ

カスタムシェイプで長方形や四角を描くときに
ガイド引いてから描いたり
適当に描いた後パスを選択してサイズを調整したり
四角や円なら描いた後
上の比率を設定ってところで数値を入力してサイズを整えていて

カンバスをダブルクリックして数値入力画面が表示されたりしないかなとダブルクリックしたけど
何もおこらなくて
そういやラインツールのオプションで矢印付けられたりしたけど
長方形はどうだろう？と押してみたら
サイズを指定する所があったという。
でも面倒くさいお( ´･＿･｀)

※ラインツールのオプションで開始点にチェックを入れたライン

[編集] – [コンテンツに応じて拡大・縮小]Ctrl+Alt+Shift+C
スマートオブジェクトには使えない

上で使ったアルファチャンネルは
クイック選択ツールで選択範囲を作って
[設定範囲] – [設定範囲を保存]から作成

参考adobe help

Adobe Photoshop CS5 * コンテンツに応じた拡大・縮小

何がいいのかイマイチ判らないまま仕事で使う事になったので
とりあえず動作確認用にローカルにインストールしてみようとしたら
Warning: session_start()ってエラーがでて
上手くインストール出来なかったよっていうメモ。

環境

windows7 64bit
xampp1.7.3
concrete5.4.1.1.1 日本語 最新安定板

インストールの準備

以下のリンクを参考にphpMyAdminからconcrete5用の空DBを作成
バーチャルホストも用意しておく
うちは_c.localhostにした。

inputlog – Concrete5をxamppにインストール
インストール準備 :: concrete5日本語公式サイト

インストール

_c.localhostにアクセスすると下のようなエラーが表示されて先に勧めなかった。

Warning: session_start() [function.session-start]: open(\xampp\tmp\sess_jpft2igj399p07rk0ecstj7tn5, O_RDWR) failed: No such file or directory (2) in D:\_webroot\c5\htdocs\concrete\startup\session.php on line 18

エラーの原因

どうも、php.iniのsession.save_pathがおかしいみたい。

C:\xampp\php\php.ini

を開いて、1496行目あたりの

session.save_path = "\xampp\tmp"

を
こんな感じに修正

session.save_path="C:/xampp/tmp"

xamppのコントロールパネルからapacheを再起動して
_c.localhostにアクセスしてみるとエラーが消えた。

変な達成感があるけど、実際まだ始まってすらいない。

MySQLのサーバーアドレスは
デフォルトだとlocalhostで
その下はMySQLにログインする時のidとpass
データベース名はインストールの準備で作ったヤツ

ダウンロード

旧バージョン(1.7.2)をインストールしたかったので
こっちから拾ってきた
XAMPP – Browse /XAMPP Windows at SourceForge.net

最新版はこっちにも。apache friends – xampp for windows

インストール

全部デフォルトでポチポチしてって完了。
(※インストール先をc:にすると勝手にxamppフォルダが出来て、c:\xamppにインストールされた。

設定

localhostにアクセスして
左側のメニューの
セキュリティ – セキュリティから

そのような問題をすべて修正するには、単純に次のツールを使ってください。
=> http://localhost/security/xamppsecurity.php <=

をクリックして
パスワードを設定。

パスワード指定時にチェックをいれとかないと
mysqlrootpasswd.txt や
xamppdirpasswd.txt が生成されないみたい。

.htaccessをC:\xampp\htdocs か C:\xampp\htdocs\xamppあたりに置くらしいけど

Order deny,allow
Deny from All
Allow from localhost 127.0.0.1

や

order deny,allow
deny from all
allow from localhost
allow from 127.0.0.1

みたいなの。
大文字と小文字に違いはあるのかな？

localhostが開かなくなった、なんか間違ってたんだろうか。

あとSSIとバーチャルホスト(バーチャルドメイン？)の設定した。
xamppでinclude(SSI)を使えるようにする
ルートパスとDreamweaverとバーチャルホスト(バーチャルドメイン？)

httpd-vhosts.conf
19行目あたりの
#NameVirtualHost *:80のコメントアウトを解除して
すぐ下に

DocumentRoot "C:/xampp/htdocs"
ServerName localhost

を追加した。

(※なぜかlocalhostじゃないやつがlocalhostで開いてしまったので

php.ini

C:\xampp\php\php.ini
を開いて、mbstringで検索

1771行あたりから始まるmbstringの
;mbstring.language = Japanese
みたいなやつの先頭の「;(セミコロン)」を削除した

Welcart Home ショッピングカート for WordPress | ECサイト構築プラグイン
Welcart ライブデモ

そのうち使うかもしれない。

本体無料、テンプレや拡張プラグインは有料みたい。

コマンドプロンプトを起動させる時に
管理者として実行を選択していないのが原因だったみたい。

スタート - アクセサリ - コマンドプロンプト(右クリックから管理者として実行)

で出来た。

ちなみにandroidのエミュが起動しなくてシンボリックリンクを作成しました

cd c:\users\[user名]
mklink /d .android .androidのアドレス

参考
Android携帯を買わずにAndroid OSをテストドライブしてみようじゃないか : ライフハッカー［日本版］
Androidのエミュレータがavdファイルを上手く見つけてくれない件について – ばるの日記

キーボードショートカットを編集してると色々問題が起こるのかなぁ
Configuration再構築すると再設定しなきゃダメだから超面倒臭い( ´･＿･｀)

JavaScript エラーのトラブルシューティング（Dreamweaver CS4/CS5）

C-12. ユーザ設定フォルダの再作成

以下の操作を行い、Dreamweaver のユーザー設定フォルダを再作成します。

Windows

1. Dreamweaver を終了します。
2. 以下の「Configuration」フォルダのフォルダ名を「Configuration_OLD」などに変更します。

　注意　：　以下のフォルダは隠しフォルダのため、Windows の初期設定では表示されません。ファイルやフォルダが参照できない場合は、Windows のフォルダオプションで隠しファイルや隠しフォルダを表示する設定に変更必要があります。設定の変更方法について詳しくは、Windows ヘルプを参照してください。

Windows 7/Vista　：　Users¥＜ユーザ名＞\AppData\Roaming\Adobe\Dreamweaver ＜バージョン＞\ja_JP\Configuration
Windows XP　：　Documents and Settings\＜ユーザ名＞\Application Data\Adobe\Dreamweaver ＜バージョン＞\ja_JP\Configuration
3. Dreamweaver を再起動し、問題が改善されるか確認します。

Macintosh

1. Dreamweaver を終了します。
2. Finder で以下のフォルダを参照します。
Macintosh HD/Users/[username]/Library/Application Support/Adobe/Dreamweaver ＜バージョン＞/[language]/Configuration
3. フォルダ名を「Configuration Old」に変更します。
4. Dreamweaver を起動し、問題が再現されるか確認します。

fireworksの「カンバスを合わせる」って便利ですよね
photoshopでも使いたい！と思い調べてみたところ
イメージ – トリミングと
イメージ – すべての領域を表示を組み合わせて
同じような事が出来るみたいだったので
.jsxに出来ないかなぁと試してみました。

不具合や必要ない記述があるかと思いますが、自分が使う範囲では困らない感じになったのでとりあえず公開してみます。

fit-canvas.jsx

例1 / before これが

例1 / after こうなる

例2 / before オブジェクトがカンバスの外にはみ出てる場合

例2 / after それを含めてから削る

どんな使い方をしてるか

大元のpsdからパーツを作成する時に
レイヤーを複製で新規ファイルで作成して抽出してるんですけど
その時に、元psdのカンバスサイズを引き継いでしまうので
それを除去するのに使ってます。

※ “トリミング” と “すべての領域を表示” で削れない部分は削れません。

超参考にしたページ

Adobe Photoshop CS4自動化作戦

xampp1.7.3のapacheが起動しなくなった
原因は単純にhttpd-vhosts.confの記述ミスだったんですけど

問題を特定する為にした事のメモ

1)コントロールパネル
起動しなかった

2)apache_start.batで強制起動
apache_start.batで強制起動させられるそうな

C:\xampp\apache_start.bat

でも
“apache” is not started.と言われた

3)エラーログをみてみる

C:\xampp\apache\logs\error.log

57行目が閉じてないって書いてあった

httpd.exe: Syntax error on line 484 of C:/xampp/apache/conf/httpd.conf: Syntax error on line 57 of C:/xampp/apache/conf/extra/httpd-vhosts.conf: C:/xampp/apache/conf/extra/httpd-vhosts.conf:57: <VirtualHost> was not closed.

解決。

Flash Player をアンインストールする方法
Flash Player アンインストーラーをダウンロード出来る。

文字パネルからも変更出来ればいいのになぁ。

※ 画像のフォントはたぬきフォント(JIS第二水準漢字入りフリーフォント)を使いました。
何回かアップデートされていて現在1.05みたい。

現在157個？
高品質な飾り枠素材が、ai,jpg,pngの3種類から選んでダウンロード出来る(太っ腹だ)

こりゃ助かる。

さっき教えてもらったばかりの
コマンドプロンプトを使って、フォルダ内のツリー階層を表示したりテキストに書きだす方法
windows7でちょっと困ったのでメモ。

コマンドプロンプトの場所

スタート - すべてのプログラム - アクセサリ - コマンドプロンプト

起動するとこんな事が書いてある

C:Users\ユーザー名>

とりあえずcdでディレクトリ移動してみる
これでCドライブへ移動

C:Users\ユーザー名>cd c:\
[enter]
c:\>

で

tree[半角スペース]ツリー構造を書き出したいフォルダ

とするとコマンドプロンプト上でツリー構造が表示される(一番最初の画像みたいなの)。

追記 / パラメーターに[/f]と[/a]がある

/f 各フォルダーのファイル名を表示
/a 拡張文字ではなく、ASCII文字で表示

ツリー構造を書き出したいフォルダはコマンドプロンプトへドラッグ＆ドロップすると勝手にフルパスを表示してくるので
ドラッグするのが楽チン。

で、これをtxtに書きだすには

tree[半角スペース]ツリー構造を書き出したいフォルダ>tree.txt(ファイル名は任意)

で、これで実行すると
クライアントは要求された特権を保有していませんと言われてしまった。

理由

Windows VistaやWindows 7ではUACによる保護で、Cドライブのルートへのファイルの保存は制限されています。

ビルトインのAdministrator(通常は無効になっています)でログオンするかUACを無効にすれば保存が可能ですが、通常はCドライブ直下に保存せずに、フォルダの中に保存することを推奨します。

C(ルートデレクトリー)にファイルを保存しようとすると、「クライアントは要求された特権を保有して – Microsoft Answers

UACを無効にしたくないので
書き出し先をDドライブにします。

ところが
Dドライブへ移動する時cd d:\とやるとこうなる

C:Users\ユーザー名>cd d:\
[enterキー]
c:\>

あるぇ？

Dドライブへ移動するときはこうやるみたい。

C:Users\ユーザー名>cd /d d:
[enter]
d:\>

まとめると

cd /d d:
tree /f [対象フォルダをドロップ]>tree.txt
[enterキー]

d:直下にtree.txtが出来てたら完了

cs4～はbridgeを使うみたい。

ちなみに追加のプラグインはこちらから

cs4

アドビ – Photoshopの：Windowsの場合：Adobe PhotoshopのCS4 – プラグイン（オプション） – 日本语
アドビ – Photoshopの：Macintoshの場合：Adobe PhotoshopのCS4 – プラグイン（オプション） – 日本语

cs5

アドビ – Photoshopの：Windowsの場合：Adobe PhotoshopのCS5 – プラグイン（オプション） – 日本语
アドビ – Photoshopの：Macintoshの場合：Adobe PhotoshopのCS5 – プラグイン（オプション） – 日本语

これ2009年くらいに話題になったらしいんだけど、全く知りませんでした。。。

ここ / jScrollPane – cross browser styleable scrollbars with jQuery and CSS
iframeも、親htmlにjsを追加するだけで(operaでマウスホイールが反応しなかったけど)スクロールバーを追加できたり
子htmlに直接jsを追加する事でマウスホイールも反応するように出来るかんじ。

練習

乱雑モックアップ｜jQueryでツイッターを取得してjscrollpaneを適用

ツイッターをjQueryで読み込む方法の参考にしたページ

jQueryでTwitterの自分のつぶやきを表示する | webOpixel

opera:configの中にそれらしいのが見当たらないので途方に暮れていたけど
エクステンションでいいのがあった。
operaのエクステンションって使った事なかったけど簡単ですねぇ。

Source – Opera extensions

ctrl+F9でソース表示

メニュー – エクステンション – 拡張機能の管理から設定を変える事で行数も表示でけた。

よかったよかった。

ついでにいれた画像を拡大するヤツもなんかいい感じ
Image Preview Popup – Opera extensions

safariを使った方法

ツールバーに開発を表示させる

開発からユーザーエージェントを変更する
iPhoneのUA(ユーザーエージェント)は最初からあるので選ぶだけ。

開発 – ユーザエージェント

ログインしてみる。

UAをiPhoneにしておくとハコニワは対応してないと言われるので
ここらへんを参考にAndroidのUAに変更してみる

スマートフォンのユーザエージェントを纏めてみたよ « 色々やってみてはみる
softbankのMobile Creation / Android™ ユーザエージェント

例えばガラパゴスのUAはこれ

Mozilla/5.0 (Linux; U; Android 2.2.1; ja-jp; SBM005SH Build/E1172) AppleWebKit/533.1 (KHTML, like Gecko) Version/4.0 Mobile Safari/533.1

それを

開発 – ユーザエージェント – その他
にコピペするか
UserAgents.plist

C:\Program Files (x86)\Safari\Safari.resources\UserAgents.plist

に追加して(テキストエディタで開ける)、safariを再起動させる

20110527追記
追加する場所は入れ子を間違えなきゃ
どこでもいいと思うけど、うちが入れてるのは
UserAgents.plistの一番下の

</array>
</plist>

の手前に、以下を追加

<dict>
<key>separator</key>
<true/>
</dict>
<dict>
<key>name</key>
<string>GALAPAGOS (005SH)</string>
<key>version</key>
<string>2.2.1</string>
<key>platform</key>
<string>SoftBank</string>
<key>user-agent</key>
<string>Mozilla/5.0 (Linux; U; Android 2.2.1; ja-jp; SBM005SH Build/E1172) AppleWebKit/533.1 (KHTML, like Gecko) Version/4.0 Mobile Safari/533.1</string>
</dict>

うまく追加できてればこんな感じになってるはず。

20110527追記ここまで

初ハコニワ

よくわかんない。

追記

ブラウザではタッチイベントを拾えなかったけれど
Android SDKを使うとタッチイベントを実行する事ができました。

趣旨が変わってしまったけど。

参考
Android携帯を買わずにAndroid OSをテストドライブしてみようじゃないか : ライフハッカー［日本版］

virtualAndroidが起動しないとき
シンボリックリンクの作成方法
Windows7におけるシンボリックリンク作成 « katharsis blog
これでどうでしょう。

Adobe – Dreamweaver Extension
上の一般、レイアウト、フォームとか書いてあるタブの所にjQueryのタブを追加
ボタンひとつで

$(function(){

});

とか挿入出来る。

jQueryのコードヒント拡張もあるみたいなんだけど
jQuery API extension for Dreamweaver | XTND.US – Xtnd urslf! Extensions for software. Adobe Dreamweaver, Drupal, jQuery, Eclipse, Fireworks
Dreamweaaver側のショートカットを変更してるとインストール出来ないのよね

一応

C:\Users \[ユーザー名]\AppData\Roaming\Adobe\Dreamweaver [各バージョン]\ja_JP\Configuration\Menus\

のMenus.xmlを削除するとインストール出来る。
変更したショートカットが無くなってしまうので、WinMergeなんかを使って差分をコピったりするのもいいかも。

WinMergeの説明はこちら / ファイル比較ツールをWinMergeに変更す
WinMerge 日本語版本体はこちら / WinMerge 日本語版

緑色のJoin Now it’s FREEをクリックして
メールアドレスとパスワードを登録し
urlを入力したらSpeed upをクリックして少しまつと完了

こんな感じのcssが

こうゆう風になりました。

わたくしごっちゃになっておりました。

こんな感じの記述です。

<!--#include file="nav.html" -->

<!--#include virtual="nav.html" -->

fileはそのファイルからのパスで
virtualはdocument rootからのパスみたい

大きなサイトで、ヘッダーやメニューやフッターを
共通のパーツとして書きだすと修正の時なにかと便利な感じがしました。

あと、javascriptがクライアントサイドで書きだすメニューなんかと違って、
SSIは文字通りサーバーサイドで処理されるので、検索で不利になるような事はないそうですぜ。

そんでもって、ローカルで作業する時
xamppの初期状態だとSSIを使うには.shtmlにしなくちゃいけなかったと思うのだけれど
それだと困るので.htmlでもSSI使えるようにするだす。

やり方

1)
httpd.confの418行あたりを
(xamppを何も変更せずにインストール場合は、多分以下の位置)

C:\xampp\apache\conf\httpd.conf

2)
こんな感じに変更して

AddType text/html .shtml .html
AddOutputFilter INCLUDES .shtml .html

3)
Apacheを再起動、でおkなハズ。

追記)
.htaccessならこんな感じ

AddType text/x-server-parsed-html .shtml .html
Options Includes

その他、バーチャルホストの設定などは以前の投稿を参考に

ルートパスとDreamweaverとバーチャルホスト(バーチャルドメイン？)

最新のファイルを探していたけど見つからなかった
おかしい、確かにあるはずなのにって
問題のフォルダを検索してみたら
やっぱりそのファイルは存在するようだった
でもそのフォルダに行くと見つからない。

ん～？

よくよく見てみると
探していたフォルダのファイルの日付は
「日付時刻」で
検索で表示されていたファイルの日付は
「更新日時」だった

右クリック – 並び替え – その他
から更新日時を探し出してチェックを付けたら出てきた。

なぜだ。

親(index.html

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ja" lang="ja">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>乱雑モックアップ｜親ページ</title>
<meta http-equiv="Content-Script-Type" content="text/javascript" />

</head>
<body>
<ul>
 <li><a href="after.html?http://www.google.com">googleを開く</a></li>
 <li><a href="after.html?http://www.yahoo.com">yahooを開く</a></li>
</ul>
</body>
</html>

子iframeがあるhtml(after.html

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ja" lang="ja">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>乱雑モックアップ｜子ページ</title>
<meta http-equiv="Content-Script-Type" content="text/javascript" />
<script type="text/javascript">
window.onload=function(){
var innerUrl=location.search.substring(1);
document.getElementById("innerFrame").src=innerUrl;
}

</script>
</head>

<body>
<iframe id="innerFrame" src="" frameborder="0" width="640" height="480"></iframe>
</body>
</html>

これで、親ページのリンクの?以下の名前
(after.html?http://yahoo.co.jpならhttp://yahoo.co.jp)のファイルを
子のiframeで開けるのだが
これ、大丈夫なんでしょうか？

?javascript:alert('alert');

でalertがでるけど、alertを任意に使えるって事は何か別の事がされるんだろうか？
パスワードなんかを扱わないページは気にしなくていいのだろうか。
という感じで使えるものかわからんので教えてない。

font-size、
pxで指定するとIEで拡大縮小できなくなる、font-size。

ブラウザやOSやフォントによって大きさも変わるしって事で
bodyに85%くらいを指定するくらいでおしまい、って感じに
結構ぞんざいに扱っていました。

そんな人間なのに、最近意味もなく
「YUI CSS Resetを使ってるし、YUI CSS Fontsも使ってみようかな」と思い立ち
YUI3.3をダウンロードしたはいいけど忙しくて放置してところに
素敵なタイミングで以下の良エントリーがっ。

YUI 3のCSS Fontsを使っている場合のフォントサイズ対応表をCSSのコメントに書いておくと便利ですよね :: 5509
※cssコメントの対応表あり

みんな、pxに対応する%を覚えて使ってんのかなぁ、すげぇなぁ。。。と思ってたけど、コメントいれちゃった方が優しいっすよね。
さっそくパクろう。

YUI 3: CSS Fontsのダウンロードや対応表

YUI 3: CSS Fonts
解凍後以下のフォルダの中にあるよ

YUI Library\yui\build\cssfonts

fonts-context.cssってなんだろ

追記
使い方間違ってたっ！！

任意のfont-sizeをYUI CSS Fontsを読み込んだあとの
bodyに指定してたので次のような事になってた。

font-familyを変更したらサイズが合わない？

body{
 font-family:"メイリオ", Meiryo;
 font-size:93%;
}

としたら12pxにならなかった。

確認用の画象(20110424.png)をつくって、

確認用のソースを用意して

<style type="text/css">
body{
 font-family:"メイリオ", Meiryo;
 font-size:93%;
}
.test{
 padding:20px;
 position:relative;
}
.text{
 position:absolute;
 top:88px;
 left:30px;
 color:#f33;
}
</style>
</head>

<body>
<div class="test">
 <p>メイリオで12px</p>
 <p><img src="20110424.png" width="145" height="115" alt="" /> </p>
</div>
<div class="test">
 <p class="text">メイリオで12px</p>
 <p><img src="20110424.png" width="145" height="115" alt="" /> </p>
</div></body>

textを重ねてチェックしてみたら、15pxになってるぽい。
表示結果

検索すると理由が書いてありました
YUIのfonts.css[to-R]
bodyにfont-sizeを指定するとyuifontsの指定が上書きされちゃうのね
そりゃそうだ。

上記cssを以下のように変更してチェック

<style type="text/css">
body{
 font-family:"メイリオ", Meiryo;
}
.test{
 font-size:93%;/*←ここに移動*/
 padding:20px;
 position:relative;
}
.text{
 position:absolute;
 top:29px;
 left:31px;
 color:#f33;
}
</style>
</head>

<body>
<div class="test">
 <p>メイリオで12px</p>
 <p><img src="20110424.png" width="145" height="115" alt="" /> </p>
</div>
<div class="test">
 <p class="text">メイリオで12px</p>
 <p><img src="20110424.png" width="145" height="115" alt="" /> </p>
</div></body>

表示結果

最初にリンク貼った徳田さんとこのサンプルソースもそうゆう風に書いてあるのにね。