実直なHTML5/CSS3でつくられたモバイルファーストのフレームワーク -Markup Framework
商用利用も無料、変更もコピーも再配布もOK、汎用性に優れたレイアウトやUIエレメントをスタンダードなHTML5/CSS3で実装したフレームワークを紹介します。 ウェブサイトを構築する際に、ベースとして利用するのによさそうです。 Markup Framework Markup Frameworkの特徴 Markup Frameworkのサポートブラウザ Markup Frameworkのデモ Markup Frameworkの特徴 レスポンシブ対応、モバイルファーストのレイアウト。 再利用可能なUIエレメントのライブラリ。 最新のスタンダードなHTML5/CSS3を使用。 ピュアなHTMLとCSSで、Hackなし、JavaScriptなしです。 ミニマルなマークアップ。 ページの容量は小さめ。 サーチエンジンにフレンドリー。 アクセシブル。 セマンティックスとスタイルの明確な分離。 モジュー
HTML5やCSS3を使った次世代表現を学ぶのに役立つコードサンプル
わずか280行程度のJavaScriptで作られ... / JavaScriptで作るいろいろな物理シミュレ... / JavaScriptによる波の物理シミュレーショ...他...全14件
[JS]レイヤーに要素を配置し、分離して3Dにぐるぐる回転させるスクリプト -CSSMatrix
jQueryのプラグイン「CSSMatrix」を使って、不連続のレイヤーに要素を配置し、それぞれを分離して3Dにぐるぐる回転して表示するデモを紹介します。
いまさら聞けないRetina対応のための「ピクセル」の話
ピクセル密度とピクセル比の関係 ピクセル密度は、数が多ければ多いほどスクリーン上で鮮明な描画ができるわけですが、上述したピクセル比とは直接関連しないものです（と考えています）。たとえば、Galaxy S IVのようにピクセル密度は441ppi、ピクセル比は2という端末もあれば、HTC Oneのように、ピクセル密度は468ppiだが、ピクセル比は3という端末もあります。 ※両方とも実機で検証したわけではないので、Wikipediaの情報が正しければの話ですが。 ※ピクセル比とは違うものですが、それと似た単位であるdppx (dots per pixel unit)では、CSSで定義された1インチが96pxになるため、1dppx = 96dpiになります。 ピクセル比に似た値「dp」とwindow.devicePixelRatio Androidの密度非依存ピクセル「dp」 Density-i
イラレの図形をObjectiveCやAS3、JSON形式に変換できるイラレ拡張「DrawScript」:phpspot開発日誌
Drawscript - convert Illustrator shapes into code イラレの図形をObjectiveCやAS3、JSON形式に変換できるイラレ拡張「DrawScript」。 イラレで作成した図形をコードに変換してプログラム内で使いたい場合に使えそう。 次のように図形を変形させればコードが生成されるみたいです 覚えておくとよさげです 関連エントリ iPadやスマホのテンプレが詰まったイラレ用のワイヤーフレーム作成キット 立体的なサイコロ画像を描画するイラストレーターチュートリアル GUIパーツやアイコンがセットになったイラストレーター用UIデザインフレームワーク イラストレータで綺麗なアイコンを作るチュートリアル３５
Get element -moz-transform:rotate value in jQuery
I have CSS style for a layer: .element { -webkit-transform: rotate(7.5deg); -moz-transform: rotate(7.5deg); -ms-transform: rotate(7.5deg); -o-transform: rotate(7.5deg); transform: rotate(7.5deg); } Is there a way to get curent rotation value through jQuery? I tried this $('.element').css("-moz-transform") The result is matrix(0.991445, 0.130526, -0.130526, 0.991445, 0px, 0px) which doesn't tell me
少ない手間と知識でそれなりに見せる、ズルいデザインテクニック// Speaker Deck
少ない手間と知識でそれなりに見せる、ズルいデザインテクニック with Sass / Compass (English Version) https://speakerdeck.com/ken_c_lo/zurui-design-technique-english-version 第一回 プログラマ向けデザイン勉強会 #design4p http://connpass.com/event/1185/ で発表させていただきました。 （#p4d プログラマ向けデザイン部 主催イベント http://prog4designer.github.io/） @mah_lab さんが ズルいデザインのRails gemを作って下さいました http://blog.mah-lab.com/2012/11/07/zurui-design-for-rails/ (Repository) https://git
HTML5, CSS3, JSでマルチプラットフォームのデスクトップアプリを作れる「TideSDK」:phpspot開発日誌
HTML5, CSS3, JSでマルチプラットフォームのデスクトップアプリを作れる「TideSDK」 2012年09月12日- TideSDK | Create multi-platform desktop apps with HTML5, CSS3 and JavaScript HTML5, CSS3, JSでマルチプラットフォームのデスクトップアプリを作れる「TideSDK」。 元々はTitaniumDesktopとして開発されていましたが、TideSDKという名前になったっぽい。 Windows, Mac, Linux のアプリをWEB開発言語で開発できるTitaniumMobileみたいな仕組みです。 スマホだけじゃなくてやっぱりデスクトップアプリも欲しいということがありますから、こういう仕組みでさっくりとやってしまいたいですね。 Windows版アプリ Linux版アプリ Mac
CSS3を使った演出テクニックがすごいと話題に
コロプラさんと一緒に行っているコーディングコンテスト「SPEC vol.4」。 応募締切まであと1週間を残していますが、もうすでに変態的な作品が続々と投稿されているようです。 今回もとんがった作品がたくさん集まっているので、途中経過としてその一部をご紹介したいと思います。（ぼく個人の主観でピックアップして紹介していきます。審査とはまったく関係ないですよ！） スピード感がある演出 CSSだけでモーションタイポグラフィ 立体的な動き トーナメントの演出 くまー！ 3連休は SPEC vol.4 で決まり！ SPEC vol.4の締切は7/18（水）です。 賞品はMacBook Proなどなど超豪華！ この3連休にでもぜひぜひチャレンジしてみてください！ SPEC vol.4
PhotoshopでデザインしたシェイプをCSS3に変換するプラグイン「CSS3Ps」:phpspot開発日誌
CSS3Ps PhotoshopでデザインしたシェイプをCSS3に変換するプラグイン「CSS3Ps」 CSS3でちょっと凝ったオブジェクトを作りたい場合に、Photoshopがそのまま使えてCSS3にコンバートしてくれます。 CSS3で描画した驚きのグラフィックス、というのも、こうしたツールを活用すると驚きのCSS3グラフィックスでもなんでもなくなるのかも。 シェイプをデザインします グラデーションなんかもつけつつ プラグインのボタンをクリックで出力。そのまんま。 画像じゃないから軽いという点もポイントですね 関連エントリ CSS3でシャレオツなリストを作るチュートリアル アニメーションするバナーをCSS3で作るチュートリアル CSS3で出来たクールなLightBox実装チュートリアル CSS3で描かれたシェイプのサンプル集
Juaraslot88: Situs Slot Gacor dan Judi Slot88 Online Indonesia
Juaraslot88: Situs Slot Gacor dan Judi Slot88 Online Indonesia Situs Agen Judi Slot Online Terpercaya di Indonesia Juaraslot88 Selamat datang di Juaraslot88 yang merupakan situs agen judi slot online paling terpercaya di Indonesia, juga sebagai tempat bermain taruhan judi online yang aman dan murah hanya bisa anda temukan pada situs slot online terbaik Juaraslot88. Minimal deposit yang kami tetapk
画像アイコンはもう古い！CSSでスタイル自由自在のアイコンWebフォント
Font Awesome, the iconic... / Foundation Icons Fonts -... / Typicons他...全5件
CSS3でシャレオツなリストを作るチュートリアル:phpspot開発日誌
CSS3 ordered list styles - RedTeamDesign CSS3でシャレオツなリストを作るチュートリアル。 list-styleを無効にしてブラウザ標準の数字部分をやめて、content: counter(li), counter-increment といったプロパティを使って数値部分を独自にデザインしています。 リスト部分の数字のデザインはなかなか難しかったと個人的に記憶していますが、こうした方法でやれば思い通りのリストデザインが作れるんですね、ということでメモ。 CSSを使ったテクニックはどこまで進化するんでしょうね。 関連エントリ CSS3アニメーションをjQueryで使いやすくするプラグイン「jQuery Transit」 アニメーションするバナーをCSS3で作るチュートリアル フルスクリーン背景がスライドショーになるCSS3サンプル CSS3で出来たクー
IE6～IE8でCSS3が使える「CSS3 PIE 1.0.0」登場
PIE makes Internet Explorer 6-9 capable of rendering several of the most useful CSS3 decoration features. 15日(米国時間)、「CSS3 PIE」初のメジャーバージョンとなる「CSS3 PIE 1.0.0」が公開された。CSS3 PIEは、CSSレベル3に対応していないIE 6/IE 7/IE 8に対して、いくつかのCSS3プロパティをレンダリングする機能を提供するプログラム。Apache License v2およびGPL v2のデュアルライセンスのもとオープンソースで公開されている。 CSS3 PIEは、既存のCSSスタイルシートに「behavior: url(PIE.htc);」の1行を追加するだけでCSS3が利用できるようになるユーティリティツール。現在サポートされているCSS3
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
jQueryとCSS3を使った円形の画像がフリップするスライドショー – creamu
cmmntr.com
IDEA * IDEA
cmmntr.com
CSS3の制作をぐっと楽にする厳選20のオンラインツール
これからのWeb制作に使える、HTML5,CSS3の対応表や各種リソース
