Flickrで使われているあのクールなドロップダウンメニューを実装してみよう:phpspot開発日誌
woork: Flickr like horizontal menu This tutorial explains how to implement an horizontal menu Flickr-like using CSS and Javascript to show/hide sub-menu: Flickrで使われているあのクールなドロップダウンメニューを実装してみよう！ 次のようなクールなドロップダウンメニューを実装してみましょう。 紹介元で、HTMLと画像のサンプルが配布されています。 実装自体は次のように関数が定義されていて、 <script language="javascript"> function showMenu(id_menu){ var my_menu = document.getElementById(id_menu); if(my_menu.style.
無料で使える2カラムのWebサイトテンプレート80選『80+ Free 2-Column We...
Web 無料で使える2カラムのWebサイトテンプレート80選『80+ Free 2-Column Website Templates』 Webサイトを簡単に作りたい。 そんなあなたにおすすめなのが、『80+ Free 2-Column Website Templates』。無料で使える2カラムのWebサイトテンプレート80選だ。 以下にいくつかご紹介。 » Blooming 角丸と花の画像のヘッダが特徴のテンプレート » Hyperglass 角丸とヘッダのグラデのかかった円のデザインがWeb2.0デザインっぽく印象づけている » Stylized かっこよくシンプルなテンプレート。ブログにぴったり » Stickybud ヘッダの背景画像がとてもかっこいいテンプレート » Travel Portal カラフルな自然にインスパイアされたテンプレート » Affection ビクトリア調のデ
各種CSSメニューをカスタマイズしてダウンロードできる『CSS MENU MAKER』 | 100SHIKI.COM
このサイトでメニューを作って張ってみたんですが メニューがTOP画像の上に表示されるのです。 どうすればよいでしょうか？ Top Tools Yotube Music Diary これがHTMLで ul#menu { margin:0; padding:0; list-style-type:none; width:auto; position:relative; display:block; height:36px; font-size:12px; font-weight:bold; text-transform:lowercase; background:transparent url(“http://error911.up.seesaa.net/image/bg.jpg?20090326204938″) repeat-x top left; font-family:”Trebuchet
ものスゴく便利なグリッド表示用ブックマークレット登場 | Web担当者Forum
Web担編集部の安田です。Web担のはてブ件数1万件超え（）を記念して、ご愛読のみなさんのお役にたてる便利なツールを作りました。名付けて、「位置調整可能なグリッドオーバーレイ」ブックマーク。ウェブデザインをする人なら日常的にdivの幅や隙間の長さを測ったりしていることでしょう。そういうときに手放せなくなるツールです。 akiyanさんが作った便利なグリッドオーバーレイのブックマークにインスパイヤされて、さらに便利な機能を盛り込んでみました。 名付けて、「位置調整可能なグリッドオーバーレイ」ブックマーク。 使い方その1普通のブックマークレットです。以下のリンクを右クリックして「お気に入りに追加」（IEの場合）または「このリンクをブックマーク」（Firefoxの場合）してください。 IEでは「追加しようとしているお気に入りは安全でない可能性があります。続行しますか？」とのセキュリティ警告が出ま
CSSのfont-family：ヒラギノとＭＳ Ｐゴシックとメイリオの悩ましい関係 : webデザイナーのナナメガキ
CSSでのfont-familyの指定がとても悩ましい。文字コードによって表示が変わったりするし、イレギュラーケースまで想定すると煩雑なコードになってしまう。ちょっと整理しながら考えてみる。 まず、font-familyを何も指定しないと、だいたいのブラウザではデフォルトで設定されているフォントで表示されるのだが、文字コードがUTF-8だとWindowsのIE6で英数文字が「Times New Roman」になってしまう。※文字コードがShift_JISやEUC-JPの場合はデフォルトのフォントで表示される。 それでは例えば総称ファミリー名（generic-family）である「sans-serif」のみ指定してみると、WindowsのIE6では文字コードがShift_JIS・EUC-JPの場合は「Lucida Sans Unicode」で、UFT-8の場合は「Arial」で表示されてしま
『色の決まりを知っていれば「センス」がよくなる』
システム会社に「色はとりあえず適当にお願いします」と言ってあがってきたものを見ると「えーっ」という配色になってあがってくることがよくある。「適当に」と指定していない自分が悪いのだが色をすべて指定しないと使ってはいけない色の組み合わせを使ってきてしまうのだ。 という私も初めて自分でチラシのデザインを作った時は「韓国風の色遣いだね」とつっこまれたが、緑や赤の原色を多様してしまった。（韓国の色づかいが悪いと言っているのではありません）そこでデザイナーさんに進めてもらったのは配色辞典。そこにあげられている色を使えばたちまちセンスの良い色遣いができるようになるのだこれホントに。 たとえば参考サイトは http://www.colourlovers.com/ これを見ると３色とか５色の色があげられているのでその色の組み合わせを使ってあげるとセンスがよくなる。 ああ、なんと便利な。ちょっと知ってるだけで
CSSで角がまるい吹き出しを作る「CSS Speech Bubbles」とか吹き出しいろいろ - GIGAZINE
CSSを使って吹き出しを作成することができるCSSファイルとJSファイル、それから画像ファイルをひとまとめにしたセットです。XHTML1.0準拠で、Internet Explorer 6 と 7、Firefox 2.0、Safari 2.0、Opera 9.0で動作確認ができています。 ダウンロードは以下から。 willmayo.com >> CSS Speech Bubbles 実際のサンプルは以下にあります。 CSS Speech Bubbles 角をまるくしているのは、「curvyCorners」を使用しているとのこと。 ほかにもこの吹き出し方のものは以下に多くあります。 入力欄（フォーム）部分をマウスでクリックすると吹き出しが出てくるタイプ Tooltip for forms リンクの上にマウスを乗せると吹き出しが表示されるタイプ Ajax tooltip リンクの上にマウスを乗せ
パンくずリスト（Topic Path）を作成する際に使えそうなサンプル8種｜CSS HappyLife
普通のエントリー久々な気がする今日この頃。 今回はトピックパスとかパンくずリストなんて呼ばれてる、ちょっと規模の大きいサイトでは日常茶飯事で見かけるアレのサンプル色々です。 サンプルの前に #main .entryBody #topicPath_01 とかってなってますけど、#main .entryBody はウチのサイトの都合で優先順位上げの為にやってるんで、コピったりする場合はいらない感じです。 #main .entryBody #topicPath_01 { margin:10px 0; } #main .entryBody #topicPath_01 li { display:inline; line-height:110%; list-style-type:none; } #main .entryBody #topicPath_01 li a { padding-right:10
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
[CSS] フキダシ風領域を作る![[CSS] フキダシ風領域を作る](https://cdn-ak-scissors.b.st-hatena.com/image/square/dbeef3dd893734597820e6d7209f7754caf6c27a/height=288;version=1;width=512/http%3A%2F%2Fwww.magicvox.net%2Farchive%2F2006%2F12030158%2Fcover.jpg)