Works
web creators 1月号にデザインを寄稿しました

2009年11月29日に発売された、web creators 1月号にデザインを寄稿しました。
企画・文・スクリプト作成はtiny-studioの田中朋也さん。
jQuery特集で、ビーム光線(違うけど!)をどう表現していくかというところで、スケジュール一覧リストがカレンダーにフォーカスしていく様子を作成しました。
軽く解説しておきます。
jQuery-Effect-Spectrumの導入
上記URLよりダウンロードしたZIPを解凍します。
本体はjquery-effect-spectrum.jsですが、jQueryとjQueryUIもあわせて必要。
さっそくコードに貼り付け、指定をします。
jQuery-Effect-Spectrumのカスタマイズ
実際にカスタマイズしていく。head内のスクリプトをいろいろ変えてみることで、発生源、ターゲット先、ビーム光線の色や太さ、スタイルなどカスタマイズが可能です。
$(document).ready(function(){
$('h1').click(function(){
$(this).effect('spectrum',{
dest: $('span'),
spCss: {
borderWidth: '1px',
borderStyle: 'solid',
borderColor: '#F00'
}
});
});
});
この場合だと、「1pxで赤の実線が、h1をクリックすると、spanにとぶ」ということになります。
実際に誌面で紹介されているものはもう少し複雑なものになりますが、場所によって線の色や太さは随時変えられますよっていうサンプルになります。
他にもいろんなjQueryのサンプルが載っていますので、ぜひ参考にしてみてください。
ちなみに…
細々とやっているtommmmyのライフログ、「tommmmyののぞきあな」では、今回は紹介されていませんが、mbMaskedGallery.jsというのを使って、画像に透明マスクをかけています。
元はMTから出力されるただの四角い画像なので、どうにかしてこれをふわふわに自動でできたらなと思っていたところへ力強い味方!と思って実装したわけです。
が!
めちゃめちゃ重い!
ので、何か代替えを考えています…。
という、余談でした。
Tags: design, jQuery, web creators, おしごと
by tommmmy at 2009-12-01-Tue 00:33
in Works
|
この内容に関連してそうなエントリー
TrackBack(0)
Comments(5)
天天素 said...
ED治療:www.kanpoucom.com/energy/66.html
性器増大:www.kanpoucom.com/energy/23.html
K Y Jelly潤滑剤:www.kanpoucom.com/product/230.html
経口中絶薬ru486:www.kanpoucom.com/product/113.html
天天素:www.kanpoucom.com/product/58.html
曲美 通販:www.kanpoucom.com/product/25.html
曲美:www.kanpoucom.com/product/28.html
INVERMA:www.kanpoucom.com/product/315.html
中華牛鞭:www.kanpoucom.com/product/167.html
at 2011-03-15-Tue 16:31
男宝 said...
MaxMan:www.allkanpo.com/product/MaxMan.html
VigRx:www.allkanpo.com/product/VigRx.html
Supra PE:www.allkanpo.com/product/SupraPE.html
D10 媚薬:www.allkanpo.com/product/D10.html
狼1号:www.allkanpo.com/product/%E7%8B%BC1%E5%8F%B7.html
狼一号:www.allkanpo.com/product/%E7%8B%BC1%E5%8F%B7.html
三体牛鞭:www.allkanpo.com/product/%E4%B8%89%E4%BD%93%E7%89%9B%E9%9E%AD.html
Xing霸:www.allkanpo.com/product/Xing%E9%9C%B8.html
男宝:www.allkanpo.com/product/%E7%94%B7%E5%AE%9D.html
徳国 増大宝V12:www.allkanpo.com/product/増大宝V12.html狼1号:www.allkanpo.com/product/%E7%8B%BC1%E5%8F%B7.html
狼一号:www.allkanpo.com/product/%E7%8B%BC1%E5%8F%B7.html
三体牛鞭:www.allkanpo.com/product/%E4%B8%89%E4%BD%93%E7%89%9B%E9%9E%AD.html
Xing霸:www.allkanpo.com/product/Xing%E9%9C%B8.html
男宝:www.allkanpo.com/product/%E7%94%B7%E5%AE%9D.html
徳国 増大宝V12:www.allkanpo.com/product/増大宝V12.html
at 2011-04-15-Fri 16:38
UGG ブーツ said...
天候は徐々にすぐに自分自身にいくつかの良, UGG ブーツ,それを準備する服だけでなく、ハンサムと破線,UGG ブーツ 販売,多くの気質より細く独特の美しさがもっと,UGG 店舗,美しいファッションクリスチ,UGG ブーツ 激安の宝石類を身に着けて.UGG クラシックミニ,UGG キッズ,UGG 手袋,UGG ベビーブーツ,UGG バッグ,ジミー チュウ 靴,Christian Louboutin Chaussures
at 2011-10-24-Mon 11:19
終極痩身 said...
美人豹:www.kanpocom.com/pro/meirenbao.html
超級脂肪燃焼弾:www.kanpocom.com/pro/FAT-BURNERS-3.html
終極痩身:www.kanpocom.com/pro/zhongjishousheng.html
御秀堂養顔痩身カプセル:www.kanpocom.com/pro/yxty.html
韓国痩身一号:www.kanpocom.com/pro/hanguoshou-575.html
アリ王:www.kanpocom.com/pro/ANTKING.html
at 2011-03-15-Tue 16:30