ラベル 便利ツール の投稿を表示しています。 すべての投稿を表示
ラベル 便利ツール の投稿を表示しています。 すべての投稿を表示

2015年2月14日土曜日

sublime text3を使い始めたメモ

前から気になっていたsublime textを使い始めました。
codaを使っていたのですが、気になってsublimeを使ってみると、これがいろいろ便利!
うーん。。codaから乗り換えようかという気になりました。
(transmitは便利なので、これからも使っていくでしょう)

━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━

さて、あまりにも便利なので、備忘録的に幾つか。

■「emmetでのhtmlタグ入力の超省力化」

emmetというzen-codingの後継をプラグインで。
・emmetは、例えば、option+control+enterした後、「 li*>a」などとすると、選択している全ての行にli要素を追加していってくれる優れもの。
 これは本当に素晴らしい!

・htmlを書いた時に<br />などの閉じタグがxhtmlのファイルでないとスラッシュがでないので、修正。以下のページのようにhtmlとすればOKだった。trueにすると、イマイチ。
http://front-end.hatenablog.jp/entry/2014/11/08/184343


■「関数名リスト ジャンプ」

「super+r」で起動され@以下の文字列をインクリメンタルサーチするoverlayコードジャンプが便利です。しかし、function以外もいろいろ表示されるので、以下のようなコードを、preferences -> keybindings - userにて記述。
[
{ "keys": ["super+r"], "command": "show_overlay", "args": {"overlay": "goto", "text": "@function "} },
{ "keys": ["super+shift+r"], "command": "show_overlay", "args": {"overlay": "goto", "text": "@"} }
]

これでfunctionから始まるものにジャンプしやすくなりました。(CMD+rでfunctionで始まる宣言がリストアップされるように設定。)

しかし一つだけ欠点が。ファイル内のfuncion宣言順ではなく、「function」の一文字1文字が検索に反映され、関数名がそれによってsortされてしまいます。
本当はfunctionリストがサイドバーにでも表示されるプラグインがあればいいのですが、これほど便利なsublime textでまだそのようなプラグインが見つかりません。不思議です。知っている方がおられたらお教えください。

■「単一ファイル内検索と置換」

CMD+shift+fで、複数ファイルが検索置換できるのは素晴らしい。
が、単一ファイル内で検索置換がしたかった。
いろいろ調べて、CMD+alt+fでできた。(mac)
これは便利です。
これまで、複数タブに渡って検索置換が行われてしまうので、弱っていました。

また、alt+control+enterで、一括置換もできた。replace all。このショートカットも便利。(emmetのタグ補完とかぶっているが。。)


■「日本語検索のenter問題回避」

人後で検索をしようとすると、「enter」キーを押した瞬間に検索開始されてしまい、うまく漢字変換ができません。
そこで、以下のページなどに対処方法が書かれています。
https://gist.github.com/chibicode/ad1f50b3b191ee694556
設定が若干面倒ですが、これを設定すると後が楽です。

2010年6月27日日曜日

Google AJAX Feed APIでブログFeedを表示でけた。ありがたや。

javascriptで外部ブログのRSSフィードを表示させたいと思い、Google AJAX Feed APIが良さそうで、実験し、うまくいったのでメモです。

以下のサイトに詳しく書いてありました。ありがたや。
http://h2ham.seesaa.net/article/100840896.html

以下の本家サイトで、自分のサイトURLを入力してAPIキーを取得し、
http://code.google.com/apis/ajaxfeeds/
ソースコードにそのキーを入力。

そのコードを貼り付けたら、なんとすぐ表示されました。
「クロスドメイン対策」が必須だと思っていて気が重かったのですが、
スーパー簡単でした!

ありがたや。。。。。。 

2010年5月25日火曜日

透過PNG実装。(Unitpngfix.js)

透過PNGをIE6でも実装するjsを色々あたってみて、Unitpngfix.jsがかなり気に入りました。
http://labs.unitinteractive.com/unitpngfix.php

clear.gifという透過GIFファイルを一枚読み込んで、
<!--[if lt IE 7]>
        <script type="text/javascript" src="unitpngfix.js">
<![endif]-->
とインクルードするだけ。

png24でも、CSSでのbackground画像でもきれいに透過表示してくれます。
ほんとうに手軽でびっくり。
ありがたや。。
(でもbackground-positionについてはまだこれからとのこと。確かにIE6では背景を繰り返すと表示が崩れたりするようです。ああ、IE6。。。)