RedLine Magazine : jQuery Cycle Plugin を使ってみました
jQuery Cycle Plugin を使ってみました 少し前にSBMなんかでよく見かけたjQuery Cycle Plugin、かっちょいいからいつか使いたいなーと思ってたんですが、タイミングよく機会があったので使ってみました。 jQuery Cycle Plugin って何? jsライブラリ「jQuery」のプラグインで、これを使うといろんな種類のエフェクトを使って画像のギャラリーが簡単に作れるという物です。エフェクトというと、なんとなく「script.aculo.us」を連想したりもするんですが、とりあえずサイトでjQuery使ってるし、その流れでjQuery Cycle Pluginを使ってみようということになりました。いろんな動きがあるので、まだ見たことない方は一度jQuery Cycle Pluginでデモを見たらいいかも、です。 設置方法も簡単だった で、さっそく準備。jQ
RedLine Magazine : Photoshopブラシ「まとめ」の「まとめ」
Photoshopブラシ「まとめ」の「まとめ」 2009.11.22 2件追加しました。 2010.02.07 5件追加しました。 先日Photoshop用ブラシをFireworksで使うためのエントリを書いたので、その肝心のブラシまとめ記事のまとめ。ちょっと自分でもこういう系のエントリをブクマしすぎて把握できなくなってきたのでメモ的に。 勢いでまとめたのでリンクミスとかあったらすいません＞＜ 今まで自分がブクマとかしたブラシまとめ・紹介ページ とりあえず適当にジャンル分けしてみた。 光系・キラキラ系 光が超カッコいいPhotoshopのブラシ色々まとめ:phpspot開発日誌 きらめく光のPhotoshopブラシ200選 | CREAMU 45の光を表現するphotoshopブラシ集[記事紹介]*ホームページを作る人のネタ帳 光線を描くためのPhotoshopブラシ250+ | CREA
RedLine Magazine : 印刷用CSSのお話
印刷用CSSのお話 最近担当したサイトでは印刷用CSSをたいがいセットにしてます。同業者の方だと経験あるかもしれないですが、昔の鬼級テーブルレイアウトの頃は言われた事なかったんですがCSSを使い始めてから「背景が印刷できない」と、よく言われました。「ブラウザの設定で『背景も印刷する』にチェック入れると出てきますよー。デフォルトではインク節約仕様になってるんすねー（嘘かホントかは知らない）あはははー」とか返してました。 デフォルトの状態で印刷できないってのは問題あるだろってのはもちろんちゃんと分かってたんですよ。ここは背景扱いにしたらデフォ状態で印刷したらエラい事になるぞ、とか使い所の選別はしてましたし。まぁでも「あなた、なんでもかんでも画像化するの大好きなクセに検索対策っ！検索対策っ！さっさと検索対策～！って言うじゃん」とか鬱憤も溜まってました。 印刷用のCSSを用意するようになってからは
RedLine Magazine : 古びた紙素材を作成するチュートリアル
古びた紙素材を作成するチュートリアル 今日Twitter経由でこのサイトを知った。 Lunacore Photoshop Training - Old Poster tutorial (part 1/9) これこれ。これ知りたかったー！「WANTED」とか書いてあって掲示板にはってありそうな感じの加工方法。 9ページにも渡って超丁寧にPhotoshopの加工が解説してありました。全部英語だけど、なんかキャプチャと拾える単語だけ見て想像力で解読できるはず！ 元々はこちらのConveni-Ent - 味のある古びた紙素材を作成するチュートリアルで上のサイトを知ったんだけど、他にも2つ、汚れた感じの紙を作るチュートリアルがリストアップされてて参考になりましたー！ ということで、やっぱりFWでやってみた なんていうか、FW使いはフォトショ使いに比べてちと肩身が狭いと感じる事が時々あるのでFWでも同
RedLine Magazine : jQueryでnの倍数だけに何か処理する（追記有）
jQueryでnの倍数だけに何か処理する（追記有） >>081007：追記1 :nth-child について追記しました。 >>081007：追記2 :lt について追記しました。 今までのバックナンバーリストを一覧でダダダーと並べてるページがあって、（このサイトで言うと全エントリのアーカイブページみたいなページ）リストの件数が少なかった時は特に何も感じなかったんだけど、サイト公開から時間が経って「数が増えてなんか見難くない？」みたいな話になった。 で、5件分ごとに区切り線入れたいっていう提案をされて了解したけど、なんかどんな方法が効率いいんか迷った。手作業で5件目ごとにclass振っていく様な手数増える方法でもいいんだけど、今新しいのが上、古いのが下ってなってる状態で上から順番に5件目毎にclass付けした所で更新の度に1つずつズラしていくの？手数増えるにも程があるｗｗｗみたいな発想にな
RedLine Magazine : リストタグを使用時のIEでの変な隙間を消す
リストタグを使用時のIEでの変な隙間を消す 私的覚え書き。 リストタグを使用してメニューを作ったりする際にIEだけに変な余白が入る事がある。それを解消するネタ。 >>問題のサンプル・こんな感じ。 Firefox等で見るとちゃんとメニューの間が詰まっててＯＫなのだが、IEの場合だと勝手に余白が入る。marginやpaddingを0にしても、liタグを途中改行しても効果なしで、その都度ごまかしてきたりしてたんだけど、とりあえず原因はIEの場合、リスト内のインライン要素をブロック化すると余計な余白を入れるというかline-heightの解釈が正しくないっぽい。 >>対策はこんな感じ。 li { line-height:0; } a { display: block; background-color:#900; padding: 5px; color: black; text-decoratio
RedLine Magazine : IE6 standalone の落とし穴
IE6 standalone の落とし穴 ※2008年2月13日夜、「解決した！の巻」追記しました。 大袈裟なタイトルにしてしまったけど、そんな大袈裟なお話ではないです。ごめんなさい。 どうでもいいと言えばどうでもいい話なんだけど、2月13日に先駆けてIE7をstandalone版から正式版に変更した。とはいえIE6もまだまだ無視できないということで、IE6の検証にはevolt.org - Browser Archiveのものを利用させてもらってるわけなんだけど、どうもコイツは透過絡みの処理ができないっぽい。 jsでもcssでも「透明」と名のつくものは一切関知しません的な態度をとられてるんだけど、これ何とかする方法ってあるのかな。なんかIE7正式版+IE6 standalone環境もいいじゃんって思ってたけど、思わぬ落とし穴だった。もしかして私だけだったりする？わかんないけど。 つーことで
RedLine Magazine : PCを出荷状態に戻してみた
PCを出荷状態に戻してみた 最近メインマシンの調子がすこぶる悪く(悪くしたのは私なんですが)、これはもうOSの再インストールですか？とか思いつつもなんだか面倒で放置気味にしてた。どのくらい具合が悪いかといえば普通に「スタート > 終了オプション」でシャットダウンできない程度。 少し前にちょっとしくじった事件があって、レジストリをおかしくしてしまったんですよね。自業自得。「スタート > 終了オプション」に触れようもんなら即時に固まるという恐ろしい現象をさけるべく、別の場所からシャットダウンをしていたものの、やっぱり習慣で気がついたら「終了オプション」にマウスが乗ってて「アアァァァァーーーーまたやってもた…」みたいな事を繰り返すうちに再インストールの存在が大きくなっていきました。でも面倒なのでしばらく放置。 と言ってるうちに連休じゃないですか。クライアントも休みじゃないですか。これはチャンスじ
RedLine Magazine : IE7のフォント絡みでこんな話があった
IE7のフォント絡みでこんな話があった Twitter経由でこんなCSSのフォントサイズに関するバグを教えて頂きました。（バグと呼ぶのか、仕様と呼ぶのかは分かりませんが）発端はfloralさんのこの発言。 IE7で検証した？http://redline.hippy.jp/lab/css/bodyfontsize625.php 以前このブログで書いたこの記事。 >>RedLine Magazine : bodyにfont-size:62.5%を指定すると･･･ 内容はbodyに対してfont-size: 62.5%を予め指定しておくと、フォントサイズをemで指定する際、12ピクセル相当なら1.2em、16ピクセルにしたいなら1.6emという風にemを使ったフォントサイズ指定が分かりやすくなるよというものでした。 そしてその記事に対して前述の通り、floralさんのポストからIE7だとなにやら
RedLine Magazine : サーバサイドCSS、Smart*CSSを試してみた
サーバサイドCSS、Smart*CSSを試してみた こちらの記事を拝見して興味津々で試してみました。 >>ウノウラボ Unoh Labs: 「サーバサイドCSS」という選択 >>Smart*CSS | Lism.in 一言で言うと、こういうものらしいです。 Smart*CSSは構造化（階層化、あるいは入れ子）したCSSを動的に変換して出力するシステムです。変換はSmart*CSSが自動でやってくれるので、「手元で変換して、そのファイルをアップ」のような面倒なことは一切必要ありません。 ウノウラボさんのページ内で世の中のCSSを書く人はCドライブに保存して動かない物はいらないと書かれていて、確かにそうだろうなーと思ったけど、幸いにもSmart*CSSに必要なSmartyもローカルにインストール済みだったので、結構気軽に試せました。 Smart*CSSのインストール >>Smart*CSS イ
RedLine Magazine : 気になるMODxを試してみる
気になるMODxを試してみる MODx(モドエックス)とは、PHPとMySQLで動作するオープンソースのCMSツールの1つです。オープンソースのCMSといえばXOOPSなどが有名ですが、ちょっとMODxに興味を持ったので試しに使ってみます。MODxについての詳細は下記リンク先をどうぞ。 MODx Content Management System（英語） MODx - Wikipedia(日本語) まだ日本ではそこまで有名でもないみたい（？）で、解説サイトがあまり多くはないんですが面白そうなので挑戦。参考サイトは上記 Wikipedia に記載されています。 MODxの特徴 インストールが簡単 Ajaxを取り入れた使いやすいインターフェイス 階層管理が簡単（ツリー形式で分かりやすい） 見た目は静的なURLでページを生成できる 標準の文字コードはUTF-8。eucやshift_jisの言語フ
RedLine Magazine : MT管理画面ではてブ数を表示させる
MT管理画面ではてブ数を表示させる 各種SBMのコメントから自分にとって有益な情報を得られる事も多いのでマメにチェックしています。MTの管理画面でどんなエントリがブックマークされているか把握できれば便利だなということでそれを実現してくれるプラグインのご紹介。 MTの管理画面のブログ一覧画面やエントリー一覧画面にはてなブックマークでブックマークされた数を表示させるプラグイン。 >>Milano::Monolog: AddHatenaBookmarkUserNum v0.2 以前「SBM Comments Viewer」という各種SBMのコメントをブラウザの下のほうに表示するGreaseMonkeyについて書いた気がするんですが、それだと自分がそのページを見ないとブックマーク、コメントして頂けたかどうか把握できないので、上記サイトで配布されている「AddHatenaBookmarkUserNu
RedLine Magazine : ボックス全体をリンクにしたい
ボックス全体をリンクにしたい まずはこちらの発想の元ネタのサイトの紹介。 Link Boxes (Ask the CSS Guy) やりたいことは上記ページの上部の画像のように、見出しやテキストを置いている部分をリンクボックス化したいという主旨。マークアップや正しい書式にこだわらないなら簡単にできるのだが、ちゃんとした事をしたい人向けのTips。 ※以下のソースは上記サイトからの引用です。 上記サイトの言いたい事を簡単な日本語にして主旨だけ書きます。 ※訳とかまとめ要らないという方はその先に「それ、jQueryでやってみる」とか書いてみたので良かったらそちらへ進んでください。 まず中身はこんな感じ。見出しとテキスト。 <h2>About Us</h2> <p>How my life story became a Hallmark movie.</p> これらをボックスにしてリンクを付けたけ
RedLine Magazine : カテゴリ内の前後エントリへリンク
カテゴリ内の前後エントリへリンク MTいじりメモ。 個別エントリー・アーカイブのデフォルトのテンプレートにも前後のエントリへリンクするソースが入ってたのだが、同じカテゴリの前後エントリへリンクしたいなーという事でそんなプラグインを探してみた。(今更･･･) カテゴリ内の前後エントリにリンクするプラグイン >>Previous and next in category 参考にさせて頂いたのはこちらのサイト。 >>同じカテゴリーの前後のエントリーへリンクする Movable Type テンプレート 無料配布 - 商用ＢＬＯＧ専門店 上記サイトで紹介されていた追加ソースは、前後のエントリへのテキストリンクが「一つ前のエントリーへ」「次のエントリーへ」となっていたので、その部分を「<$MTEntryTitle$>」に変更してエントリのタイトルが表示されるようにしてみました。 ただ、こうするとものす
RedLine Magazine：：CSSでリモートロールオーバー サンプル
下のリンクにマウスを合わせてみてください。 各リンクに合わせて上の白黒画像がカラー画像に差し代わります。 cssソース <style type="text/css"> <!-- #sample01{ position:relative; background:url(xxx.jpg) no-repeat left top; width:446px; } #sample01 ul{ padding:185px 0px 0px; } #sample01 ul li#left a span, #sample01 ul li#right a span{ display:none; } #sample01 ul li#left a:hover span, #sample01 ul li#right a:hover span{ position:absolute; display:block; wid
RedLine Magazine : MTのエントリを関連付けてみる
MTのエントリを関連付けてみる 今回追加したのは「RelatedEntries」というプラグインで、エントリーどうしを関連付けて、エントリー間のリンクを表示してくれるという便利なもの。 >>Six Apart内の説明ページ >>制作者 藤本 壱さんのサイト インストールは他のプラグインと同様MTのプラグインフォルダにDLしてきたフォルダを丸ごとアップして、cgiが動作するようにパーミッションを変更するだけ。 インストール詳細は上記urlでも詳しく解説されているので安心。 各エントリの関連付けの方法も至って簡単で、プラグインをインストしたら「投稿画面」のその他の操作に「エントリーの関連付け」が表示されるのでGOボタンをクリック。あとは表示されたエントリを見ながら関連付けを行うかどうかを設定するだけ。 テンプレートの変更は上記url内にも書かれているが、このサイトではこんな感じにした。 <MT
Redline Magezine：：CSSでポップアップネタ
(2007年4月5日追記) このサンプルは一部のブラウザにしか使えません。 >>改正版のサンプルをこちらに置いているので、そちらを参考にしてください。 ブックマークしてくだった方、すいませーん・・・。 サンプル01:元ネタのCSS examples - centred pageさんと同じパターン ここにマウスを乗せるとポコっと。サンプル１ spanでマークアップされたテキストが出てきます。 CSSソース <style type="text/css"> <!-- .popup01 a{position:relative;} .popup01 a span{ position:absolute; top:-55px; left:0px; width:200px; padding:5px; visibility:hidden; background:#f5f5f5; border:2px sol
RedLine Magazine : ボタン1つで実体参照に変換するプラグイン
ボタン1つで実体参照に変換するプラグイン エントリ投稿時にhtmlなど各種ソースコードを入力する際、「＜」とか「＞」とかを実体参照文字に置き換える必要がある。 個人的にはそういうソースを掲載する際はいつもだいたいDWなんかで実体参照込みのソースに変換した後、エントリ画面にコピーしてたりしたんだけど、このプラグインを使えばいちいちそんな事をしなくても、該当部分を反転させてボタン一発で該当部分を実体参照に置き換えてくれる。 ダウンロードはこちら MovableType用EntityRefButtonプラグイン v0.0.2 (エムロジック放課後プロジェクト) これ、めっちゃ便利かも。 >>インストール方法、使い方はこんな感じ。 2006年12月07日 20:53 | Red | パーマリンク
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
