タグ

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

  • 【WordPress】お問い合わせ内容も管理画面で管理できてトレビア〜ンなフォームプラグインinquiry form creator | バシャログ。

    【WordPress】お問い合わせ内容も管理画面で管理できてトレビア〜ンなフォームプラグインinquiry form creator | バシャログ。
    spade9970
    spade9970 2012/11/30
    ContactForm7の代わりに試してみるかな。ここまで細かい項目は不要だけど。
  • cssで縦方向中央に配置する方法(5つのケース+1) | バシャログ。

    iPhone 4Sが発売間近。 買おうか迷って一旦諦めたはずがまた迷い始めました、hakoishiです。 Siriに甘い言葉をささやきたい。英語できないけど。 さて、コーディングで縦中央にオブジェクトを配置したいことって少なくないですよね。 しかしながら、cssはそういうのちょっと苦手。 「ほら、あの時使ったアレだよアレ!」と過去のソースを掘り起こしてみても、状況が違ってて使えないケースも多かったり。 というわけで今回は、cssで縦中央配置するためのtipsを5つのパターンに分けてまとめました。 case1:画像の場合 上下方向中央を始点として画像を配置し、画像の縦サイズの1/2だけネガティブマージンで上に移動。 サンプル html <p class="case01"> <img src="http://dummyimage.com/100x100/000/fff.gif&text=img

    cssで縦方向中央に配置する方法(5つのケース+1) | バシャログ。
  • jQuery Mobile が必須スキルになる!と思うのでこれから勉強する際に参考になる記事まとめ | バシャログ。

    Adobe の Creative Suite 5.5 が発表になりましたね。 Dreamweaver の進化っぷりが凄まじいです。マジで。 HTML5+CSS3への対応が目に付きますが、個人的にはjQuery MobileとPhoneGapフレームワークの導入に注目します。 アプリ開発はこれまで、Objective-Cやjavaが主流でしたがDreamweaverでアプリへの書き出しまで出来てしまうなんて…。今後、モバイルアプリケーションの統合開発環境のデファクトスタンダードになる予感が。 ってことで、まずはjQuery Mobileを理解せねば! jQery Mobile についてはまだ書籍はあまりなく洋書しかありませんでしたので、参考になる記事を取り上げてみます。 http://jquerymobile.com/ 家サイト jQuery Mobile Gallery http://w

    jQuery Mobile が必須スキルになる!と思うのでこれから勉強する際に参考になる記事まとめ | バシャログ。
  • Apple 関連のフォントを手に入れよう | バシャログ。

    シーブレインのマニュアル作成サービスチームから「スマートフォンで読めるマニュアル作成」を PR するページを作ってほしいとのご依頼があり、ページをデザインました。 せっかく iPhone を素材に使うのだから、フォントApple 風にしたいわあ、といろいろ探した際に知ったいくつかのフォント情報をメモします。 ひと目でフォント判別できる一流デザイナーにあこがれる! 1. Apple語サイトのフォントは「AXIS」 Apple 公式サイトの日語や Apple store で手に入るパンフレットには「AXIS」というフォントが使われていることが多いそうです。 その「AXIS」試用版が、無料でダウンロードできます。登録さえすれば商用も OK という太っ腹ぶりです。 なだらかなラインがスマートな、きれいなフォントです。 Type Project|試用版ダウンロード http://www.

    Apple 関連のフォントを手に入れよう | バシャログ。
    spade9970
    spade9970 2010/07/03
    Myriadは知っていたがAXISは知らなかった。日本語フォントは貴重なのでさっそく入れる。
  • 重いFirefoxをなんとかして速くしたい | バシャログ。

    その強力なアドオンで、とっても便利なFirefoxですが、毎日使っているとドンドン動きが重くなっていってしまいます。 うーん、どうにか軽くならないものかと色々やってみました。 起動を速くしたい まずはとにかく時間のかかる起動をなんとかしたいと思います。 Firefoxはブックマークやら履歴やらクッキーやらをSQLite DBで管理しています。 毎日使っていくうちにDBは大きくなり、起動や動作が重くなっていくとのこと。 そこでSQLite Optimizerというアドオンを使って、DBの最適化をしてしまいます。 手順は以下の通り。 1. SQLite Optimizerをインストール。 2. アドオンの管理画面でSQLite Optimizerの環境設定画面を開きます。 3. 『Firefox終了時にsqliteデータベースのREINDEXを実行する』にチェックを入れます。 以後、Firef

    重いFirefoxをなんとかして速くしたい | バシャログ。
    spade9970
    spade9970 2009/07/31
    about:config → network.dns.disableIPv6をtrue
  • 【Fireworks】GIFで支給されたロゴを簡単に白抜きに加工する方法 | バシャログ。

    例えば Web サイトのリニューアル案件では「ロゴのデータはありません。現サイトで使っている gif 画像を使ってください」というケースがよくあります。 「ロゴを白抜きにしたデザインパターンを作りたいんだけど…」という場合には、ロゴをトレース→パス化して使い勝手の良い素材を用意するのがベストな方法ではありますが、トレースする時間が取れない時は以下の方法がお手軽でオススメです。 使用した画像加工ソフトは Fireworks です。 ↑支給された(というか Web サイトからコピーした)ロゴの例。透明化もされていないし、切り抜くのも面倒。 STEP 1 ロゴ画像をグレースケールで保存します。 STEP 2 グレースケール化したロゴ画像を背景の上に配置。 STEP 3 ロゴ画像を選択して「フィルタ」→「カラー調整」→「カラーの塗り」を設定。 カラーは何色でも良いですが、ブレンドモードは「反転」に

    【Fireworks】GIFで支給されたロゴを簡単に白抜きに加工する方法 | バシャログ。
  • 【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 | バシャログ。
  • デザイナー・コーダー必見!使えるform関連jQueryプラグインの数々 | バシャログ。

    こんばんは、最近ホルモン焼きにハマっているishidaです。 WEBサイト制作時、formは必ずといってもいいぐらい存在します。 お問い合わせフォームや会員登録フォームなどがすぐに思いつきますよね。 デザインをがっつりフォーム部分で作り込んでも、CSSのみでは、 実現できなかったりすることもよくあります。 そんなクセのあるformを、よりリッチに!かつ操作性を向上!できるjQueryプラグインの数々をご紹介します。 デザイナーの方は、フォームのデザインの参考に。 コーダーの方は、ページ作成時間の短縮に手助けになればと思います。 jQuery plugin: Validation フォームの入力チェック(バリデーション)が簡単にできるプラグイン。 エラーメッセージはlocalizationディレクトリ内に18言語用意されています。 日語用は別途作成し、使用することが可能です。 jQuery

    デザイナー・コーダー必見!使えるform関連jQueryプラグインの数々 | バシャログ。
  • [使えるCSSテクニックVol.2] CSS を使った見栄えの良いページャー | バシャログ。

    第 3 回目は「見栄えの良いページャー」です。 シンプルなコーディングで見栄えの良いページャーを実現します。 XHTML のサンプルは以下です。とてもシンプルです。 <ul class="pager"> <li class="prev"><a href="hoge">&laquo; PREV</a></li> <li><a href="hoge">1</a></li> <li><em>2</em></li> <li><a href="hoge">3</a></li> <li><a href="hoge">4</a></li> <li><a href="hoge">5</a></li> <li class="next"><a href="hoge">NEXT &raquo;</a></li> </ul> サンプル1: とてもシンプルなページャー とてもシンプルなページャーのサンプルです。 «

    [使えるCSSテクニックVol.2] CSS を使った見栄えの良いページャー | バシャログ。
  • 1