げんきワークス［ブログ］

jqueryで、イベントを使うとき、

例えば、li要素などにclickイベントを紐付けしたとして、後から動的にli要素を増やしたら、その増やした要素にも、同じclick要素を紐付けするにはどうしたらいいのか？

liveでイベントをつけたら、あっけなくできました。。。。

liveの存在をしらず、bindでやろうと四苦八苦していました。。。。

メールチェックを2台のPCでやるために、思い切ってoutlook expressから、Gmailに乗り換え。
なにしろメールアドレスを10個くらい持っているので（別に悪い事をしているわけではありません。＾＾）、大変だった。。。。

でも乗り換えてみると、思った以上に便利。

特に良いのがTODO機能

メールをTODOリストにいれておき、入らなくなったら削除。
TODOリストはいつでも画面の端っこに表示されている。

これだけの機能なのですが、私の場合はメールで依頼を受けたり、メールを基点に仕事が展開したりするので、キーとなるメールをTODOにひょいと入れておくと、忘れないし今進行中の案件一覧みたいになって仕事がと～っても整理できる感じです。

それにしても、Google特有の、痒いところに手を届かすためのプログラミングの用い方。。。

華美にするためではなく、便利にするためだけに使われるシステム資源。その姿勢はいつもながら勉強になります。

フォントが多くなるとイラストレータなどの立ち上がりが遅くなったりしていろいろ不都合が、、、かといって少なければ少ないでデザインなどに支障がでたりします。

そこで、フォント管理ソフトなのですが、Windows7の64bitだと今まで愛用していたフォント管理ソフトがうまく動かない。

どうしようと困っていたら、実はwindows7の機能にとても便利なものがあることを発見。

１．常時インストールはしないけど、場合によりインストールして使いたいフォントを適当なフォルダにまとめて保存

２．そのフォルダを開きプレビューウインドを開くと、フォントのカタチが見える

３．表示方法を詳細にし、名前、更新日時などのフィールド部分を右クリックし「タイトル」を表示する。。。と、フォントの名前も表示される。

４．あとは、インストールしたいフォントを右クリックで「インストール」

５．フォントを開くともっと詳しいビューワが開く

これで、今までのフォント管理ソフトとほぼ同等なことができるようになりｍした。

よかった。

最近、システムの面倒を見たりのために、客先にて長時間居座る機会がおおくなってきた。そうするとちょっとした空き時間に、コーディングの修正とかできたら便利だなと思い、頑張ってノートPCを購入。

前から気になっていた、いわゆるCULVノートというやつ。（いまだにCULVの綴りが覚えられない、、、ネットブックみたいな簡潔な呼び名はないものか）

ASUSのUL20Aというやつを購入、ほどよいサイズと稼働時間のわりにパワフルで重宝しています。

そうなってくると、外出先でもネット接続したいのですが、Eモバイルなどは別途月額料金がかかってしまうので、ちょっと辛い。

そんなとき、みつけたのが、パケホーダイダブルを利用した128K通信というやつ。

どうせケータイでもパケホーダイを目一杯つかっているわけですので、その料金でPC接続もできたらとても嬉しい！

そこでさらにもうひとつ、私のケータイSH-04Aはbluetooth対応ですので、ノートPCからBluetoothに接続し、ケータイをつかってネットができればUSBとかつながなくてもネット接続できてとても重宝しております。

まあ、速度は全然でないけど、地方都市長岡では、まだまだ通信範囲が広くて便利です。

多分、私の探し方に問題があるのでしょうけど、javascriptを用いたドロップダウンメニューのサンプルで、画像を用いたものがあまりない。
（テキストのはそりゃあもう沢山あるけど、、、）

そんなキッカケから、jQueryでコーディングしたので、ちょっと「コードの公開」にチャレンジしてみる。

なるべく簡単に（HTML以外のコードをいじらなくても）実装できるドロップダウンメニューです。

→公開ページ

我ながら分かりにくい説明ではあるが、、、、
コードの公開って思っていたよりも大変。

ｊQueryライブラリの　ImageSwitch　を使う機会があり結構いじったので備忘録。

（ImageSwitchとは）

画像をカッコよく切り替えるためのｊQueryライブラリです。
簡単な実装で、画像の切替効果をかっこよく表現できるためギャラリー的なサイトなどに有用かと思われます。

（実装方法）

まずは、jQuery　と　ImageSwitch　をダウンロードし、下記のように実装します。
※jQueryは最新のものより1.3.2くらいがオススメ。私の環境で最新のバージョンではImageSwitchが動きませんでした。

■htmlファイル内

<script type="text/javascript" src="./js/jquery-1.3.2.js"></script>
<script type="text/javascript" src="./js/Groject.ImageSwitch.js"></script>
<script>
$(document).ready(function(){
$("#switch").click(function(){ //#switch　は、切替を発生させるボタン等のid
$("#img").ImageSwitch( // #img　は、切り替える画像のid
{
Type:'FlyIn',
NewImage:'./image/slash2.jpg'
}
);
});
});

<p><img src="image/slash1.jpg" id="img" width="469" height="217"></p><!--切り替える画像 id="img"-->
<p id="switch">クリックしてね。</p><!--切替を発生させるオブジェクト（ボタンや画像でもOK） id="switch"-->

と、上記のようにスクリプトを一文書いてあとは普通にタグにIDを設定するだけで下記のように動きます。

（サンプル１）

クリックしてね。

↑これをクリックすると画像が変わります。

と、まあここまでは、どこにでもある使い方情報ですので、ImageSwitchで検索すれば、もっと分かりやすいのが沢山でてきます。
次回からは、これを自分に都合のいいように改造したり実装したりという方法を掲載していければと思います。

多分IE6の仕様

<div class="floatLeft">

<div class="box">
～～～
<a href="url">リンク</a>
</div>
</div>

こういうHTMLの.floatLeft を float:left などで回り込ませたときに、.boxにmargin-bottom を設定してたりすると反映されない。

でも、リンクところに hover を設定すると、hoverしたときだけ急に、上記の下余白が反映される・・？

それで、hoverすると下のブロックがペコペコ動いてオカシイ。。。

とりあえず、.floatLeftにあたるブロックにpadding-leftを設定して誤魔化す。

jQueryのプラグインで、豊富な画像切替が手軽にできるImageSwitchですが、jQueryのCurrent Release（2010年3月12日現在）である1.4.2だとうまく動きません。

jQuery 1.3.2　だとちゃんと動きます。

恥ずかしながら最近覚えたCOALESCE関数

COALESCE(value [, ...])

引数のうち、最初の「NULLじゃないやつ」を返します。

シンプルな構文で、いろいろな場面で使えて便利。

でも何て読むんだろう。

読めない関数ってつづりも覚えづらい。。。。

先日書いた
form送信でsubmitのnameが送信されない

について、追加で引っかかった事

別のコーディング中に

<form action="submit.php" method="post" name="formName">

<input name="textFlds" type="text" value="" />

<select name="selectFlds">

<option value="1">1</option>

<option value="2">2</option>

</select>

<input name="submitName" value="送信" type="submit" />

</form>


こういうのでも、submitのnameが送られてこなくて、悩んでしまった。

つまり、input type="text" の要素がひとつだけで、他にselectとかがあっても、submitのnameが送信されない。。。。

と言う事。

これは、また何処かで忘れて引っかかりそうな気がする。。。