Karappo web design room

Transmit 4.3.3 にアップデートしてから（の、気がするのですが）、FTPサーバーをディスクとしてマウントできる「Disk機能」が突然動作しなくなりました。
マウントしようとすると「操作を完了できませんでした。（POSIX エラー -1 -Unknown error: -1）」という内容のポップアップが出て、マウントできない状態。



再インストールや、AppStoreで3.3.2を再度購入してみたりと試してみましたが、うまくいかずサポートに連絡したところ、下記のようなお返事。


I think we've got this sorted out in 4.3.3.

First, quit Transmit and drag the Application to the Trash. Then delete "Transmit Disk" from ~/Library/Application Support/Transmit/. Now download a fresh copy of Transmit 4.3.3 and reinstall it.

4.3.3で解決したと書いてあって「？」となりましたが、とりあえずこのヒントで
１：Applications/Transmit.appの削除
２：「~/Library/Application Support/」内の「TransmitDisk」「TransmitDisk」（他にもいくつかTransmit◯◯というディレクトリがあったのでそれら全て）を削除し
３：再インストール

で問題解決しました。３の再インストールはMacAppStoreの4.3.2でも大丈夫でした。

やれやれ、この機能に相当依存していたのでほっと一安心。

でも、これが使えない間に試していたSublimeText2のSFTP/FTPプラグインも便利でした。Sassなどの外部コンパイル系で生成されるファイルが自動ではファイル監視されないのがちょっと難ありだけど、ローカルにリポジトリを置けるので、そういう意味では今までのTransmitDiskを使った開発よりも良いです。

zen-codingのショートカット等、
使いそうなものの一覧です。

基本的なところは、
こちらの映像が分かりやすかったです。
zen-codingの書き方はこちらが参考になります。


■ ヘッダの出力など

html:5
html:4t

で、html、head、title、body あたりを一括書き出し。

link:css
で、cssの読み込み

script:src
で、jsの読み込み


■ ショートカット

Ctrl + L : 現在の行を選択
Ctrl + B : カーソルのある領域をラップしているタグの範囲を選択

Ctrl + shift + L ： 選択範囲にリンク設定
Ctrl + shigt + W : 選択範囲をラップするタグ
Ctrl + shift + A : 選択範囲をラップするタグを、zen codingで出力

HTML5のCanvasを使って画像にマスクをかけたいと思っていろいろ試してみたので、今の時点のまとめをしてみます。
参考にしたのはHTML5.jpの「globalCompositeOperation プロパティ」の章。

結論から言うと、手元のFirefox（3.6.13）で、上記のサイトで書かれているよりも対応状況が悪いように思われました。

FirefoxでNGだった設定値。
・source-atop
・source-in
・source-out
・destination-atop
・destination-in

サンプルページを作りましたので、試してみてください。
サンプルページ

上記サイトのサンプルと同じような画像（以下の２つの透過PNG画像）で、順番も同じにしていますので見比べてみてください。




描画の部分はここのコードを元に、img要素の属性にマスク用の画像のパスと「globalCompositeOperation」に割り当てる用のタイプを設定できるようにしています。

destination-inがやりたかったのにぃ、、、
同じようなCSS3の「-webkit-mask-image」と書く手もありますが、これもFirefoxが対応していないので（-moz-mask-imageとかあればいいのに・・・）どうしようか、もうすこし悩みます。

XREA、CORESERVER、hetemlなど、SSIが使えると書いてあるサーバは数多ありますが、使えるようにする方法が載っていないことが多いので書いておきます。

SSIを使えるようにするには、

以下のように書かれた、.htaccess ファイルを、
置けばその階層以下のフォルダで使えるようになります。

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

html内で、SSIを使ってファイルを読み込むときは、
以下のように書きます。

相対パス : <!--#include file = "hoge/header.shtml"--><br />
絶対パス : <!--#include virtual = "/ssi/header.shtml"--><br />
※ 絶対パスの基準は、Webサーバーのドキュメントルート<br />

結構便利なのでＵＲＬをメモっときます。
タイトルにあるとおり、ウェブ上でweb2.0ライクな（？）背景画像を簡単に作れます。
シマシマとか、グラデとか、縦縞とか横縞とかね。

Background Image Maker
解説はこちら

Windows IE で、日本語と英語が入り混じった文章にletter-spacingを"normal"に指定すると、英語の文字の大きさと日本語の文字のに対する letter-spacing が異なるようなので、微妙に文字の位置が文章のないようによってズレることがあるようだ。

Windows IEでは、divタグの中に何もない場合でも、フォントのサイズや、letter-spacing の設定が生きているため、それらの影響を受けないように、font-size:0; line-height:0;　などとした方が良さそう。

divタグの中身を背景画像のみにする場合や、単にclear:both;　などの指定のみで中に何の要素もないようなdivを使うときは注意しないといけない。

「KB912945」のパッチという超うっとうしいパッチが、2006年の4月にWindows Updateの中に紛れ込んでいたそうです。

標題の通り、Flash Player を一度クリックしないと、FLashの内容がアクティブにならないので、それを知らない人がFlash上で、「ここはクリックできるのかな？」と思ってクリックしても動かないため、場合によってはクリックできるのに、クリックできないと思い込んでしまう可能性もある。

対策方法は、上記のＵＲＬにて確認できます。
対策方法
All About Japan