タグ

ブックマーク / bashalog.c-brains.jp (10)

  • [作って学ぶ!jQuery] 第6回 プラグインを作ってみよう! | バシャログ。

    ゴールデンウィークはお台場でリアル脱出ゲームに参加して脱出できなかったminamiです。 jQuery連載も最終回、最後はプラグインを作ってみましょう! プラグインとは? jQueryのプラグインとは、 jQuery体と併せて使うライブラリのことです。 様々な拡張機能を手軽に使うことが出来ます。 例えば以下のページにも多数のjQueryプラグインが登録されています。 自分で作ったプラグインを公開することもできます。 http://plugins.jquery.com/ プラグインの使い方 プラグインを使うために必要なのは以下の手順です。 1.jQuery体を読み込む 2.プラグインを読み込む 3.プラグインを実行する 拍子抜けするくらい簡単ですね!ソース上では以下のような記述になります。 <!-- 1.jQuery体を読み込む --> <script type="text/javas

    [作って学ぶ!jQuery] 第6回 プラグインを作ってみよう! | バシャログ。
  • [使えるCSSテクニックVol.2] CSS を使った見栄えの良いテーブル パート2 | バシャログ。

    [HTML] <table id="table-01"> <tr> <th>MS 名</th> <th>パイロット</th> <th class="speech">台詞</th> </tr> <tr> <td>ザク II</td> <td>ジーン</td> <td>シャア少佐だって、戦場で勝って出世したんだ!</td> </tr> <tr class="even"> <td>グフ</td> <td>ラル</td> <td>ザクとは違うのだよ、ザクとは!</td> </tr> <tr> <td>アッガイ</td> <td>アカハナ</td> <td>大佐、イワノフのアッガイがやられました</td> </tr> <tr class="even"> <td>ゲルググ</td> <td>シャア</td> <td>ララァ、私を導いてくれ</td> </tr> </table> [CSS] 要所のみ掲

    [使えるCSSテクニックVol.2] CSS を使った見栄えの良いテーブル パート2 | バシャログ。
  • 【Fireworks】グラフィックウィザードで大量の画像を自動で作る | バシャログ。

    軽い腱鞘炎になってしまいました、toyama です。左手を使うキーボードショートカットが原因です。別名で保存とか、属性をペーストとかマスクとしてペーストとかグループ解除とかしようとすると痛いので、湿布に包帯を巻いてカバーしているのですが、広範囲に巻きすぎているのか左手だけ「リングにかけろ」みたいになっています。 この資料をもとにこの見出し画像を大量に複製して書き出してください!入れる文字はエクセルにまとめてありますので!見出しごとに写真変えてね!うんざりするほど大量にあります!納期は今日!というお仕事があると思います。 テキストをコピー&ペーストすればいいだけなのに、どうしてこんなに辛いんでしょう。そんなときは Fireworks さんにおまかせ! 自動的に画像をつくってくれます。 グラフィックウィザードを活用する こんな画像をテキストだけ変更して、大量に作るミッションです。 用意するのは

    【Fireworks】グラフィックウィザードで大量の画像を自動で作る | バシャログ。
  • サイトを公開する際に最低限抑えておきたい Apache の設定 | バシャログ。

    こんにちは nakamura です。最近トルシエさんテレビ出すぎじゃありません?ウィイレヤロウヨ。オフサイドダヨ! さてさて今回は意外と知られてないけど、サイトをインターネットに公開する際には知っておいた方が良い Apache の設定をいくつかご紹介します(一部 PHP の設定もありますが)。この設定をしていないからといって即危険にさらされるという訳でもありませんが、リスクの芽は摘んでおくに越した事はありませんよね。 無駄な HTTP ヘッダを返さない ディストリビューションにより異なるかもしれませんが、CentOS デフォルトの設定の場合 Apache が返してくる HTTP ヘッダは以下のようなものです。 HTTP/1.1 200 OK Date: Mon, 05 Jul 2010 01:01:14 GMT Server: Apache/2.2.3 (CentOS) X-Powered

    サイトを公開する際に最低限抑えておきたい Apache の設定 | バシャログ。
  • [作って学ぶ!jQuery] 第1回 セレクタを学ぶ | バシャログ。

    「作って学ぶ!jQuery連載」の2回目なんだけど、1回目。今回はセレクタについてです。 jQueryを理解するで欠かせないのがセレクタ。セレクタの種類は数多くありますが、今回は現場でよく使うであろうものについてご紹介します。 基系 要素セレクタ DOM要素(htmlタグ)を指定する方法です。 $('h1') $('ul') $('div') IDセレクタ = $('#myid') #で始まるセレクタは、id名を指定する方法です。なおidはページ内にて常にユニークである必要があります。 $('#header') CLASSセレクタ = $('.myclass') ドット(.)で始まるセレクタは、class名を指定する方法です。class名のみでの指定は、ドキュメント内を全て探しにいくので表示速度に影響もあります。IDセレクタと併用するのが望ましいです。 $('.link') グループセレ

    [作って学ぶ!jQuery] 第1回 セレクタを学ぶ | バシャログ。
  • 【Fireworks】よく使う矢印の作り方 すごく初歩 | バシャログ。

    突然雨がアホみたいに強く降ってきたりして困ります。シーブレインの toyama です。 STOP!熱帯雨林化! WEB サイトをデザインするときに避けて通れないのが矢印イメージの作成です。 テキストの頭に、ボタンの中にと、使いどころ満載。 普段 toyama がよく作る矢印の作り方をご紹介します。 1. しっぽ付き矢印 正方形を矩形ツールで書いて[修正]→[変形]→[数値を入力して変形]で回転を選択し、45°回転させます。 [数値を入力して変形]はサイズ変更、拡大縮小、回転のダイヤログボックスが一度に表示されてとっても便利です。 ダイレクト選択ツールで頂点のひとつを選択し、Delete で三角形に変形。 最初に書いた正方形が奇数×奇数の場合は三角形の頂点が 1 ピクセルになりますが、偶数×偶数の場合は 2 ピクセルの三角形になります。 パスが切れたままで気持ち悪い人は、ペンツールでパスを閉

    【Fireworks】よく使う矢印の作り方 すごく初歩 | バシャログ。
  • [使える CSS テクニック]CSSを使った見栄えの良い表組み(table) | バシャログ。

    第 6 回目は「CSSを使った見栄えの良い表組み(table)」です。 Web サイトのレイアウトがすべて table でコントロールされていた時代がありましたが、今そんなことをしたら嘲笑を買う時代です。 来の「複数のデータを表示・比較の際にわかりやすいよう見せる表組み」のためのテーブルを、CSSを使って見栄えよくしてみましょう。 1. CSS のみで見栄えよくしてみる 線と塗りだけで表現する、一番シンプルなテーブルを作ってみます。 [HTML] <table id="table-01"> <tr> <th>体名称</th> <th>スタンド名</th> <th>スピード</th> <th>持続力</th> <th>精密動作性</th> <th>成長性</th> </tr> <tr> <td>空条 承太郎</td> <td>スター・プラチナ</td> <td>A</td> <td>A<

    [使える CSS テクニック]CSSを使った見栄えの良い表組み(table) | バシャログ。
    shunhouse552
    shunhouse552 2009/07/10
    表組み、テーブルデザイン
  • 【CSS】覚えておいて損はない CSS の定番テクニック BEST 5 | バシャログ。

    ネットで検索をすると CSS のテクニックが山ほど公開されていますが、実際に商用サイトの制作をしていて個人的に利用する頻度が高いテクニックの BEST 5 をご紹介します。 ちょっと凝ったデザインのサイトをコーディングする時に、これらのテクニックに助けられることが多いです。どれも覚えておいて損はないものばかりです! IE6 でも min-height を使う 例えば、異なる高さのブロックを float しつつ底辺のラインを揃えたい時などに、「IE6 が min-height に対応していたら楽なのに!」と思うことがありますが、以下のテクニックを使えば IE6 でも min-height(相当)の適用が可能になります。 [CREAMU]CSSでmin-heightをクロスブラウザにする最も簡単な方法『Easiest cross-browser CSS min-height』 IE6 に mi

    【CSS】覚えておいて損はない CSS の定番テクニック BEST 5 | バシャログ。
  • 短期集中連載: コレだけ読めばバッチリお勧め書籍紹介「第 2 回 PHP 編」 | バシャログ。

    第 2 回目は 「PHP 編」です。 対象は、私、ichikawaの独断ですので、 気になるがあったらぜひ屋さんで手にとって見てくださいね! STEP1 「PHPの絵」 対象 プログラミング初めて!難しそうなはちょっと・・な方 おすすめポイント 「PHPの絵」という名前の通り、挿絵が多く、 初めてプログラミングを手にする人にとっても抵抗感のない1冊だと思います。 最初の方はのんびりスタートなので「え?このスピードで1冊に収まるの??」 とヒヤヒヤしますが、ちゃんとそれなりにカバーしています。 「これ1冊でPHPすべてOK☆」というには厳しいですが、 「なんだかやる気がしないんだよね・・」な気分の時も、心が折れずに読み進められる・・ そんな1冊です。 継続は力なり。そして復習にもおすすめです。 STEP2 「ノン・プログラマのためのPHP入門 10日間コース」

    短期集中連載: コレだけ読めばバッチリお勧め書籍紹介「第 2 回 PHP 編」 | バシャログ。
  • すこしズルしてリアルなアイコンを作る方法 | バシャログ。

    も杓子も Web 2.0 的な表現がもてはやされた頃、 ツヤツヤでリアルなアイコンの作成を迫られて嫌な汗をかきました。 質のよいイラストを描くことが要求される上、小さく細かい作業がてんこ盛り。 時間もスキルも足りない! [1] まずフリー写真を探します。 アイコン作るのに何故写真が必要なの?とお思いかもしれませんが何故ならすこしズルいからです。 今回はこのの写真を、アイコンっぽくしてみます。 [2] 必要なサイズにぎゅっと縮小し、背景を切り落とします。 [フィルタ]→[カラー調節]→[トーンカーブ]で、強めに調節します。 さらに[フィルタ]→[カラー調節]→[明るさ・コントラスト]でかなり思い切ってコントラストを上げます。 写真が縮小された上、強く補正をかけたことで、イラストに近いテイストになってきました。 [3] ここまでくればあとは簡単。 輪郭線を書き足したり、グラデーションを上か

    すこしズルしてリアルなアイコンを作る方法 | バシャログ。
  • 1