タグ

2011年1月21日のブックマーク (9件)

  • 画像がダイナミックにスライドするメニューバー実装jQueryプラグイン「pictureMenu」:phpspot開発日誌

    画像がダイナミックにスライドするメニューバー実装jQueryプラグイン「pictureMenu」 2011年01月21日- pictureMenu 画像がダイナミックにスライドするメニューバー実装jQueryプラグイン「pictureMenu」。 マウスカーソルを合わせるとメニューの幅がニュイーンと伸びるUIが作れます。 動きがなかなかクールなので、うまく画像と組み合わせることでカッコいいサイト作りに役立てられそうです。 次のような比較的整ったHTMLコードを初期化する感じです。 デモはセンスがいいとは言えないかもしれませんが、工夫すればかなりカッコよく出来そう。 関連エントリ ナビゲーションメニューを1歩進んだものに引き上げるjQueryチュートリアル集 ビローンと伸びるドロップダウンメニュー実装jQueryサンプル クールにアニメーションする色合い様々なjQueryメニューサンプル色々

  • リストにフィルタを掛けてソート出来る、わずか2KBの軽量jQueryプラグイン・MobilySelect - かちびと.net

    以前にも同じようなものがありましたが、 こちらのほうが良かったのでメモ。リスト (デモでは画像を使っています)にフィルタ リングしてソート出来るjQueryプラグイン。 わずか2KBと軽量で、クロスブラウザ対応 です。便利そうなのでどこかで使いたい ですね。 以前ご紹介したFilter Image Viewも良かったのですが、IE6で表示が微妙でしたが、MobilySelectは問題なく、しかも軽量です。 機能はFilter Image Viewと同様で、ボタンを押すと、そのボタン以外のリストを非表示にする、というフィルタリング。 上記は「名刺」のみの表示にした状態。 完璧に同じ挙動、とは行きませんが、IE6でもちゃんとフィルタリングしてくれます。上記はIETesterでのキャプチャ。 マークアップ <div class="selecter selecter1"> <div class="

  • jQueryUIを使ってマウスオーバー時に背景色をアニメーションさせながら変更出来ると今更知った - かちびと.net

    備忘録。マウスオーバー時に背景の 色をアニメーションしながら変更する、 というのをクロスブラウザ対応で実装 したい。css3を使えば簡単な事ですが、 ご存知のようにIEは非対応。で、色々 探してみたんですが、jQueryUIを使う のが一番良さそうな感じでした。 普通にググったらJquery Color Pluginというプラグインがあったのですが、動作はするけどIEでエラーが出ます。リファレンスを見ても そもそも数値型の値をとらない属性(backgroundColorなど)には、animate関数は対応していません。 (jQuery日語リファレンス) と書いてあるし、Jquery Color Pluginを直すのも面倒だし、どうしようかなと思ったんですが、jQueryUIを使えば凄く簡単なんですね・・・素人ですみません。 コード <script type="text/javascrip

    jQueryUIを使ってマウスオーバー時に背景色をアニメーションさせながら変更出来ると今更知った - かちびと.net
  • 文章を書くノウハウを伝授

    ITエンジニアにとって文書作成技術は欠かせません。日常のメールのやりとりにはじまり、要件定義書、機能仕様書、企画の提案書など、上司やチーム、顧客などに対して、文章でコミュニケーションをとる機会がとても多いからです。 連載『悪文と良文から学ぶロジカル・ライティング』では、論理的にわかりやすい文章を書くノウハウを伝授しています。ITエンジニアが日常的に用いるであろう文章を例に使い、どこが悪くてどう直せばいいのかといったポイントをわかりやすく解説しています。実践すれば、誰でもすぐにわかりやすい文書が書けるようになるはずです。 オリエンテーション ITエンジニアにとって「書く技術」とは? 文書の全体構成を組み立てられるようにする 内容を大きく分けて項目を立てる 適切な順番で項目を並べる 話の階層をそろえる 文章表現の基ルールをマスターする 主語と述語を対応させる 修飾語と被修飾語をはっきりさせる

    文章を書くノウハウを伝授
  • 次のサービスに使えるかもしれないロゴデザイン集22:phpspot開発日誌

    22 Designer Logo that Touch Your Heart | www.allbloggertools.com 次のサービスに使えるかもしれないロゴデザイン集22。 すっきりと美しいロゴデザインが多数紹介されています。2011年はサービスを一発あててやろうと思っている方はこうした印象深いロゴを参考にするのもよいかもしれません。 シンプルでいて、なんとなく覚えてしまうというデザインがそろってますね。 関連エントリ デザインに役立つ美麗サイトデザイン集やロゴデザイン・写真集 ロゴデザインの参考になる綺麗なロゴ集 最近公開されたNewなPhotoshopロゴデザイン70のチュートリアル集 ロゴデザインが色々あって登録も可能な「LogoSauce」 インスピレーション用ロゴデザイン色々

  • フェイスブック、ミクシィ、グリーで使われている OGP (Open Graph Protocol) とは何か - IT戦記

    みなさん、こんにちは お元気ですか?僕は元気です。 さて 最近よく、「いいね!」ボタンや「ミクシィチェック」ボタンによって、ウェブページを紹介し合う文化が少しずつ定着してきたなーと思います。 そんな中で、今後重要になってくるんじゃないかと思われる OGP (Open Graph Protocol)と言われる仕様があります。今日はそのことについて書いてみたいと思います。 OGP? おーじーぴー??とはなんでしょうか。 OGP とは 簡単に言うと「このウェブページは何のことを書いているか」という情報を、プログラムから読める形で HTML に付加する記述方法のことです。 まあ、普通のウェブページは人間が読めばだいたい何のことが書いてあるか分かりますよね。 ですが、プログラムは人間ほど頭が良くないので、そのウェブページ内の文章だけではそのページが何のことについて書かれているページなのか正確に識別す

    フェイスブック、ミクシィ、グリーで使われている OGP (Open Graph Protocol) とは何か - IT戦記
  • [D] Chromeの隠し機能を有効するabout:flagsがスゴイ! #chrome

    最近ではネタフルのコグレさんまでSafariからChromeへの乗り換えを考え始めてるらしく、サイドバーでタブが開ければ乗り換えるのになぁとか言ってるので、そんなのextensionsでありそうじゃんと思って調べてみたら、とんでもないものを見つけたw 以下その簡単な経緯と紹介 もともとChromeのサイドバータブは隠し機能として実装されていて起動時の引数で有効にできたらしいのですが、それがいつの頃からかabout:labsというアドレスをURLの代わりに入力すればそこから変更できるようになったらしいです。 で、about:labs入力して見ても白紙状態。何も起こらないので、また最新版で仕様が変わったんだろうなぁと、もうちょっと調べて見たら、今時のChromeではabout:flagsで、隠し機能が設定できるそうです。 その機能一覧が↑のスクリーンショット で、肝心のサイドバータブはどうなっ

  • ECサイトのトップページに設置したい27個の機能と情報 など10+2記事(海外&国内SEO情報) | 海外&国内SEO情報ウォッチ

    ECサイトのトップページに設置したい27個の機能と情報 ★★★★★ 載せるべき情報まとめ (Econsultancy)ECサイトのトップページでは、そのサイトが何を提供するサイトであるかを明確に示したうえで、訪問者が求める情報をすべて伝えるべきだとして、トップページに設置するべき要素を27個、Econsultancyブログがリストアップしている。 必須 サイトロゴキャッチフレーズ(タグライン)検索ボックスグローバルメニュー新着情報特別セール画像運営者情報・会社案内電話番号住所お問い合わせ方法公式コーポレートサイトへのリンクサイトマップ更新情報ショッピングカートを見る/購入手続きに進むログイン配送について利用規約店舗検索(実店舗がある場合)メルマガ登録あったほうがいい配送オプション(送料無料キャンペーンの情報など)その人に合わせたおすすめ商品ソーシャルメディアの公式アカウントへのリンク支払い

    ECサイトのトップページに設置したい27個の機能と情報 など10+2記事(海外&国内SEO情報) | 海外&国内SEO情報ウォッチ
  • ウェブ初心者も安心して作成できる、無料HTMLテンプレート素材24個まとめ - PhotoshopVIP

    『フォトショップ・ブイアイピー』の新着記事です。フォトショップやデザインをたのしむウェブサイト。2009年3月創刊以来、3800を超えるコンテンツを更新しています。フリーフォントなどの無料デザイン素材/配色やWeb制作といった最新トレンドも公開中。