TWINS

mg006.png


久しぶりに1枚。
右の子がピノコっぽい!と描きつつ思ってたのだけど、
実物見たら全然違ってた。
アッチョンブリケ。

台風一過でぐんと秋が深まってきました。
そろそろ、次のベクター素材を追加したいな。
さて、何にしよう。

2013年09月19日

posted by michi at 17:14 | Comment(0) | Vector Design | このブログの読者になる | 更新情報をチェックする

マウスオーバーで画像のタブの表示切り替え

サムネイルをクリックすると拡大画像が切り替わるのはWebショップでお馴染みですが、
そんな風に並ぶ異なるバナーボタンにマウスオーバー&クリックすることで、横のメイン画像をjQueryで切り替え表示させたい。
その際、バナーボタンはロールオーバーで用意した別画像に変化、メイン画像表示時は該当バナーボタンはロールオーバーで変化したままをキープで、という要望。

画像の切り替えはよく見かけるけれど、サムネイル自身の変化は、CSSで枠線をつけるとか、透明値を変化させるというものばかりだったような。
そして探し回ってたどりついたのがこちら。

メニューにマウスオーバーするとメイン画像が切り替わるナビゲーションjQueryプラグイン「ImageNavigation」 | NET-KING


これで行ける!と参考にさせていただき無事完成。
ところがそこで、「メイン画像」といってもその中クリッカプルマップでリンクを仕込みたいということに。
残念ながらこの方法では無理ということで、別アプローチで、タブでの切り替え表示を利用することに。

が、タブ部分で別々の画像を使用する参考例自体が少なく、しかもロールオーバーで別画像に入れ替わる例は見当たらず。

マウスオーバーでタブの表示切り替え jQuery プラグインなし | Ri-mode Rainbow

こちらを参考にさせてもらい、なんとか解決。

・バナーボタンの画像は、通常時と変化時のペアを並べ1枚画像としてそれぞれ用意。
・並ぶバナーボタンのliにbackground-repeatと通常時の表示のbackground-positionのみ指定。それと別に個別にclassを設けて、それぞれbackground-imageで画像のURLを指定。
・変化させる時の為に、.hoverでbackground-positionを変化時の表示に指定。

jQuery内でのCSSを置き換え指定などでもっとスマートなやり方があるはず!と思ったのですが、強引な力業でなんとかしたかんじです。
今の私にはこれでせいいっぱいでした。

このタブでタブ部分に画像を使用して…ってのは需要ありそうと思うのだけど…
タグ:jquery
posted by michi at 16:46 | Comment(0) | Note | このブログの読者になる | 更新情報をチェックする

Blue / Snowball iCE

mg005.jpgマイクを新調しました。
新しくきた子は、「BlueのSnowball iCE」です。
ポッドキャストを配信し、8年目。
ずっと頑固にヘッドセットを愛用していました。
一応安価なのは避けてまあまあのを選ぶようにはしていたのですが、なんて言い訳ですね。
ものぐさですみません(謝罪)

あちこち壊れながらも騙し騙し使っていた、もう何代目か知れないヘッドセット。
とうとう役目を終えてもらうことにし、新しいマイクを新調しました。
ヘッドセットは卒業です!
ちょっと変わった丸いボディで、可愛いでしょう。
ソフトボール大でそれなりの大きさだけど、普通のマイクに比べればコンパクト。
これはシリーズの中で安価なタイプですが、収録に使うだけなのでこれで十分。
USBを差し込めばすぐに使えます。

先週の配信から使い始めたのですが、この手のマイクに慣れなくてえらく緊張しました。
ヘッドセットを使ってると、顔や身体を動かしても支障ないけど、これはまっすぐマイクに向かって話さないといけませんから。
おまけに、距離か角度か私の頭の向きが悪いのか、音の入りがいまいちだったし。
録音・編集は相方のくむさん任せなので、自分ではいまいち状態が把握できず。
来週の収録までに、一人録りで少し練習しておこうと思います。

2013年06月09日

posted by michi at 23:54 | Comment(0) | Note | このブログの読者になる | 更新情報をチェックする
×

この広告は1年以上新しい記事の投稿がないブログに表示されております。