紹介済みから未紹介のものまで、jQueryのプラグイン34選です。 MobilySlider 軽量ながらも高性能なコンテンツスライダー。 jShowOff さまざまなオプションを備えたコンテンツスライ
[JS]jQueryのプラグイン33+1選 -2011年2・3月
紹介済みから未紹介のものまで、jQueryのプラグイン34選です。 MobilySlider 軽量ながらも高性能なコンテンツスライダー。 jShowOff さまざまなオプションを備えたコンテンツスライ
ナビゲーションバーに現在いるページを表示する。 - 僕がペンをにぎれば
RUNeS, CSS僕が制作・管理しているサイトではlink要素を用いたナビゲーションバーを使用していまして、そのナビゲーションバーに現在いるページがわかるようにしてみました。そもそものナビゲーションバーは↓な感じ【xhtml】 ul id="nav"> li>a href="index.html" title="Home">Homea>li> li>a href="hoge1.html" title="hoge1">hoge1a>li> li>a href="hoge2.html" title="hoge2">hoge2a>li> li>a href="hoge3.html" title="hoge3">hoge3a>li> li>a href="hoge4.html" title="hoge4">hoge4a>li> ul> 【CSS】 ul#nav { margin: 5px aut
マウスオーバー・メニュー - JavaScript + CSS
＜2007.01.24＞ マウスオーバー・メニュー。 ■マウスオーバー・メニュー マウスオーバー・メニュー JavaScript + CSSを使ったメニュー表示。 画像にマウスカーソルを重ねると、メニューが表示されます。 display:none;のdivが表示されます。 新しい領域が表示されても、下の文章の表示位置は変わりません。 position:relative;は、親の領域に対しての相対位置です。 座標を指定しないと、タグの位置が初期位置になるようですが、 left:0px;top:0px;を指定すると、通常ページの左上に表示されます。 そのため、この領域をさらにdivで囲み、position:absolute;を指定し、 表示したい領域の絶対位置を確保します。 すると、position:relative;の領域は、position:absolute;の領域からの相
Safari CSS Reference: Supported CSS Properties
Safari and Web Kit implement a large subset of the CSS 2.1 Specification defined by the World Wide Web Consortium (W3C). This reference describes the supported properties and provides Safari availability information. If a property is not listed here, it is not implemented by Safari and Web Kit. Contents: Box Model Visual Formatting Model Visual Effects Generated Content, Automatic Numbering, and L
Lism.in
Smart*CSSとは Smart*CSSは構造化（階層化、あるいは入れ子）したCSSを動的に変換して出力するシステムです。変換はSmart*CSSが自動でやってくれるので、「手元で変換して、そのファイルをアップ」のような面倒なことは一切必要ありません。 CSSというのは「言語」として見た場合、非常にイケてない仕様になっています。 #content p { ～ } #content h1 { ～ } #content ul { ～ } のようなCSSを書いて「何で毎度毎度#contentとか書かないかんねん」とキレそうになった経験のある人に使って頂ければ幸いです。特に何かプログラム言語を知っている人には馴染みやすいんじゃないでしょうか。 Smart*CSSを使用すると、CSSをこのように構造化して書くことが出来るようになります。記述方法の詳細はExampleをご覧ください。 #conten
画像置換によるアクセシビリティーの低下 | ユージック
画像置換によるアクセシビリティーの低下 2007年1月31日 Fsikiさんのエントリー「text-indent: -xxxxemの弊害」で紹介されている内容ですが、現在のCSSテクニックの常套手段である画像置換をするとFirefoxではクリックした時に画面外に飛ばした範囲にまで点線が生じてしまうので、対策として a { outline: none; } 上記のような対策をしてきましたが、なんとこれに致命的なアクセシビリティーの欠如があることを知りました。 というのはリンクをタブキーでたどる際にフォーカスされないという問題です。 僕は日頃あまりノートPCを使わないので、タブキーでのリンクの移動などをしないという事もありまして、まったくもって気づきませんでした。 解決策は以下の通り a { overflow: hidden; } MacIEではリンクが消失してしまうらしいのでMacIE用のハ
WWW ブラウザごとに異なる CSS の設定 / 詰め CSS
ぼくは XSSI を使って CSS ファイルが WWW ブラウザによって内容が変更されるような仕組みを用意しています． Mozilla 0.9.7 の動作の謎 Mozilla 0.9.6 までは，うまく自分の web ページ「おのひろきおんらいん」を表示できていたのですが，Mozilla 0.9.6+ のあるバージョンからスタイルシートが無視されるページが幾つかでてきたことに気が付きました．まさか自分の HTML 文書や CSS ファイルに問題があるとは思わなかったので，その現象を無視してちゃんと表示できるバージョンを使っていました． ところが Mozilla 0.9.7 がリリースされて，それで試してみると，やっぱりいくつかのページでは駄目でした．しかもなんとなく HTML 4.01 Transitional なページは大丈夫なのに，気合いの XHTML 1.1 だと駄目だったりするので
Simple website menu
This is a simple list-based menu, with CSS2 menu triggers for browsers that support them, and a touch of equivalent javascript for others. For discussions about this script and others like it, please see the list-based menus thread at CodingForums If you want a list-based menu with more advanced design, usability and accessibility features, please check out Ultimate Drop Down Menu The following br
画像の使用を極力控えてかっこいいCSSデザインをやってみよう
Latest topics 2019.01.22 長々と運営していましたが、本日を以て大会を終了とさせていただきます。沢山の方にご参加いただきましたこと、まことに嬉しく思います。Galleryは閲覧可能ですので、懐かしい気持ちになりつつご覧いただければと思います。 2007.04.15 公式html内に一箇所文字の誤りがありました。詳しくは2007-04-15のメモに書いておきました。要素の変更や構造の変更に変化は無いので、CSSを書く作業には影響がないのですが、気になる方はURIを参照して下さい。 Galleryが開通しました。フォームで選択してぽちっとするとサムネイルが表示されます。サムネイルをクリックすると、CSSデザインが適用された個別ページが表示されます。 よくありそうな質問に、CSSデザインは１人何個でも提出できる旨を追記いたしました。 2007.04.13 よくありそうな質問
Nifty Corners
Nifty Corners: rounded corners without images By Alessandro Fulciniti Update This is the original article. The technique has been improved with better browser support and a lot of new features. The new article has been published on the 6th of April 2005. You can read it here. The final version is Niftycube. Rounded Corners with CSS are a hot topic in web design: I think that there are hundreds of
[を] CSSで角を丸くする
CSSで角を丸くする 2005-03-18-4 [Tips] Nifty Corners: rounded corners without images <http://pro.html.it/esempio/nifty/> (via Hatena::Bookmark) 画像なしでコーナーを丸くする方法。IEでもFFでもOK。かなり使えそう。 example: あいうえお <style> #wakuwaku {background: #f8f;width:6em;} #wakuwaku p {margin:0 0 0 0;text-align:center} .rtop, .rbottom{display:block;background: #FFF} .rtop *, .rbottom *{display: block; height: 1px; overflow: hidd
スタイルシートを分けて管理する方法をまとめる - 2xup.org
comment 2006-10-17T21:15:00+09:00 お好みの言語が英語で無い場合は、日本語でどうぞ。 In this PDF file, the order of the set format rule and property's appearing was announced. This time, the method of separately managing the CSS file used on the site is announced. Why is CSS divided? I think that most reasons are the improvements of the work efficiency. The access to the revision part becomes early They are combined and co
HTML::TreeBuilder + CSSセレクタがいい感じな件
先日 PerlでCSSセレクタ で HTML::Selector::XPath がいい感じであると思ったわけですが、CSS セレクタだけじゃなく何気に HTML::TreeBuilder::XPath とのコンボがすげーイイ!ということにいまさら気づきました。 HTML::TreeBuilder::XPath で findnodes するとツリー状に連なった HTML::Element なデータ構造が返ってくるんですが、HTML::Element は API をかなりいろいろ持ってて、これをうまく使ってやるとスクレイピングを自然な感じで書けます。 例えばはてなダイアリーの任意のページから、本文部分だけをスクレイピングしたいと思ったときにキーワードリンクが邪魔だったりするわけですが、とりあえず HTML::Selector::XPath で div.section をぶっこ抜いて取れた HT
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
http://bzbell.com/archives/2008/02/11-211216.php
タブジェネレータ
http://cssglobe.com/post/1272/pure-css-data-chart
CSS Beauty
http://www.oyogu.com/web/css.html