[B! CSS3][CSS] ohwatoshiyukiのブックマーク

CSSオンリーでJSを使った風のよく使われるテクニック集１０:phpspot開発日誌

Creating 10 Most-Used Javascript Techniques Using Pure CSS Styling | DevSnippets CSSオンリーでJSを使った風のよく使われるテクニック集１０。よく使われているかどうかは実際はよくわかりませんが、ピュアCSSということでなかなか凄いテクニック集がまとまっています。我こそはCSSマスターという方は覚えておいてもよさそうです。写真ギャラリーカーソルを合わせると拡大するアイコンアニメーションするコンテンツスライダーアニメーションするプログレスバーピュアCSSなLightBox かなり色々なテクニックがなされているようですが、実用的なものが多いですね。関連エントリ JavaScript使ってないのに使ってる風のピュアCSSなテクニック集ピュアCSSで実装された吹き出しのデザイン例色々クリーンなデザイ

ohwatoshiyuki 2010/06/03

CSS
CSS3

リンク

CSS3で作るドロップダウンメニュー「CSS3 Dropdown Menu」

通常アールの効いたデザインでドロップダウンメニューを制作するときはFlashだったりjavascriptだったり何らかなスクリプトと画像を使って、組み上げるというのが現状では主流だと思いますが、今日紹介するのはCSS3で実現するドロップダウンメニュー「CSS3 Dropdown Menu」です。 CSS3 Dropdown Menu DEMO ドロップシャドウなど細かなデザイン処理はCSS3で制御されていますので、デザイン部分もCSS側で細かく調整できます。詳しくは以下また上記のように少し形態は変わりますが、CSS3に非対応のブラウザでも一応動作するようになっていますので、互換性が気になるという方も安心して利用していただくことが可能です。ソースファイルはダウンロードできませんが詳しいく解説されており、またデモページもそのままコピーしてつかえるようにシンプルな作りになっていますので、参

ohwatoshiyuki 2010/03/25

CSS3
CSS

リンク

CSS3でIEにも角丸を適用させるhtcファイル – creamu

CSS3で最も簡単にクロスブラウザの角丸を実装したい。そんなときにおすすめなのが、『curved-corner』。CSS3でIEにも角丸を適用させるhtcファイルです。 Google Codeで、CSS3でIEにも角丸を実装させるファイルが配布されていますね。クロスブラウザの角丸を実装するには、「border-radius.htc」ファイルをダウンロード、配置して、CSSに以下のように記述すればOKです。 CSS3 -moz-border-radius: 32px;//for Firefox -webkit-border-radius: 32px;//for Safari and chrome border-radius: 32px;//CSS3 behavior: url(border-radius.htc);//for IE すごく簡単な方法なので、CSS3での角丸はこれで決まりな

ohwatoshiyuki 2010/02/08

CSS3
CSS

リンク

CSS3を使った凄いアニメーション集４７:phpspot開発日誌

CSS3を使った凄いアニメーション集４７ CSS3を使った凄いアニメーション集がまとまったエントリが公開されています。注意点としてCSSだけで実現しているわけでなく、jQueryなども使っている部分があります。ただ、こういうことも出来るのか、という物が沢山で見ていて楽しく学習できます。 CSS3/jQuery Clock 一見Flashかと思えるような綺麗な時計のサンプル Multiple 3D Cubes with animation using CSS 3Dのキューブがなめらかにアニメーションします。 CSS3 Matrix Animation マトリックスアニメーション OS X Dock Mac OS X風になめらかに動作するドック今の時期だと、CSS3で出来ることはまだ出尽くしていないと思うので、驚きのエフェクトを作れば世界をワッと驚かせることが出来るかもしれませんね。

ohwatoshiyuki 2010/02/08

CSS3
CSS

リンク

知っておいたほうが良いCSS3テクニック「CSS3 Techniques You Should Know」

TOP > WebDesign , WebService > 知っておいたほうが良いCSS3テクニック「CSS3 Techniques You Should Know」 CSS+XHTMLでのコーディングスタイルが主流になってかなり建ちますが、さらに新しい、CSS3という言葉も最近は耳にするようになってきました。CSS3を使えば、今まで画像でしかどうしても表現できなかった部分等もコードで実装可能になりますが今日はそんなCSS3のテクニックをあつめたエントリー「CSS3 Techniques You Should Know」を紹介したいと思います。グラデーション表現や、ドップシャドウなどなど、いままでどうしても画像に頼っていた部分がかなり解決されるみたいです。紹介されているものノン蚊からいくつかピックアップして紹介したいと思います。詳しくは以下 ■Drop Shadows ドロッ