BloggerGoogle のウェブログ公開ツールを使って、テキスト、写真、動画を共有できます。
ul・ol・li要素の備忘録 - NxWorld
かなり今さら感はありますけど、ul・ol・li要素関連の備忘録です。 対応ブラウザ（特に一部のIEで未対応）とかそもそも使う場面がそんなにないとかの理由で使用頻度がかなり低いと思うのもありますが、低いからこそ使おうと思ったときにパッと思い浮かばなそうなので書き残しておきます。 list-style-type リストマーカーの種類を指定するプロパティlist-style-typeのメモです。 使用頻度が高いと思うのはulやolにデフォルトで設定されているdiscやdecimal辺りかと思いますが、他にもいろいろあるのと一部のブラウザでは未対応などあるので、パッと確認したいときのために一覧にしました。 画像はWin7 Chromeでの表示をキャプチャしたもの。 ChromeやFirefoxといったブラウザでは上記のように問題なく表示されますが、IEでは一部のマーカーが対応していない場合がありま
HTML5/Canvasを使った多彩なジャンルに対応したゲームフレームワーク·iio Engine MOONGIFT
iio EngineはHTML5のゲームフレームワークです。シューティングやアクションゲームに使えます。 HTML5でゲームを動かすのが現実的になりつつあります。それもソーシャルゲームのような形ではなく、シューティングやアクションゲームです。今回はCanvasとJavaScriptを活用したiio Engineを紹介します。 多数のデモが登録されています。 線やテキストの描画も行えます。 実際に遊べるゲームになっています。 マルバツゲームもあります。 iio Engineは線や四角、円などのオブジェクトを容易に描ける他、背景パターン、グリッド、テキストの描画もできます。さらに拡張によってBox2Dに対応していたり、キーボード入力によるアクションも実装できます。幅広いゲームに対応できるでしょう。 iio EngineはHTML5/JavaScript製、zlib Licenseのオープンソー
クールでアニメーションするグラフを描画できるHTML5チャートライブラリ「Chart.js」:phpspot開発日誌
Chart.js | HTML5 Charts for your website. クールでアニメーションするグラフを描画できるHTML5チャートライブラリ「Chart.js」 次のようにクールな線グラフ、棒グラフ、円グラフ、レーダーチャート等のグラフが描けます 今時のデザインがいい感じですね 関連エントリ 様々なグラフを描画できるJavaScriptライブラリ「NVD3.js」 テーブルをグラフに変換してくれるjQueryプラグイン 美麗なグラフをSVGで描画できるJSライブラリ「dc.js」 jQueryでブレットグラフを作れるjQueryプラグイン「jquery bullet graph」
HTML5 × CSS3 × jQueryを真面目に勉強 – #10.1 CSS3 Transforms(3D) | DevelopersIO
matrix3d (a1, b1, c1, d1, a2, b2, c2, d2, a3, b3, c3, d3, a4, b4, c4, d4) ではサンプルコードを交えながら順に見てくとします。 matrix3dですが、こちらもmatrix 2Dと同様、複雑な理屈で取っ付きにくいうえに、rotateや3dやperspectiveといった関数で充分に代替可能なため、今回の記事では割愛させて頂きます。 m(_ _)m Transforms 3D - 事始め 端的に言うならば、Transform 3D は要素を3次元に移動ならびに回転、拡大縮小できるというものです。更に後述するperspectiveを使うことで、要素に奥行きのある表現を持たせることが可能となります。 3DではX軸とY軸に加えて、Z軸が追加されます。Z軸はウィンドウからユーザーに向かう方向が正の値で、ユーザーからウィンドウに向
HTML5/CSS3を使った多機能デザインフレームワーク·HTML KickStart MOONGIFT
HTML KickStartはBootstrapライクなデザインテンプレートフレームワークです。 最近ではWebサイトのベースにBootstrapを利用することが多いのですが、今回はその類似ソフトウェアとしてHTML KickStartを紹介します。こちらもかなり高機能です。 Typography。 リストとメニュー。 メニューは階層対応。 テーブル。 ツールチップ。上下左右自在です。 アイコン。 プログラミングコード。 ボタン。 タブ。 パン屑。 グリッド。 画像。 スライドショー。 動画、地図、カレンダー。 フォーム。 入力フィールドのサイズ。 その他色々。 極力シンプルなHTML構造設計、jQuery利用、HTML5、モーダルウィンドウなどが特徴に挙がっています。唯一残念なのは現状はレスポンシブWebデザインでないことかも知れません。しかし全てのデバイスへの対応を考えないならむしろ手
Bootstrapで矢印を描くのなら「Bootstrap Arrows」:phpspot開発日誌
Bootstrap Arrows Bootstrapで矢印を描くのなら「Bootstrap Arrows」 全国の矢印好きの諸君。こんにちは。もうPhotoshopで矢印を描いて画像を作ってアップロードなんていうことは必要ない。 <span> に簡単なclassをつけるだけで、向きも、長さも、色だって、自由自在。 しかも、次のような美しい矢印が描画できる。センス云々の話ではなく、class="arrow" として rel で角度を指定するだけで美しい矢印が描けるのだ。 色んなUIライブラリはあれど、矢印まで描けるとなるともう選択肢は限られる。 これでBootstrapを使わない理由は一切なくなったのだ。 関連エントリ TwitterBootstrapベースのWYSIWYGエディタ「bootstrap-wysihtml5」 Twitter BootStrap に追加できる５つのコンポーネント
フリーでHTML5ベースのリッチな管理画面テンプレート:phpspot開発日誌
Free HTML5 Admin Template | MediaLoot フリーでHTML5ベースのリッチな管理画面テンプレート。 次のようなカッコいいHTML5ベースのテンプレートが公開されています。 管理画面ということでIEユーザとかは抜きにして考えてよい場合が増えそうでHTML5にしちゃっても問題無さそうです。 フリーなのにパーツ豊富ですね。ここまで使えていいんでしょうかと思ってしまうほど。 関連エントリ CodeIgniter開発での管理画面作成を楽にする「grocery CRUD」 カッコイイWEB管理画面を作成するPhotoshopチュートリアル TwitterBootstrapベースのテーマやテンプレートが入手できる「WrapBootstrap」
CoolClock - The Javascript Analog Clock
About CoolClock CoolClock is a customisable javascript analog clock. What's New (19-Aug-2010) Release version 2.1, new features include digital (text) display and two logClock modes. See logClock demo and demo2. (26-Apr-2010) Released new version 2.0 and added source to github. Added note about new onload requirements. (26-Apr-2010) Someone has created a CoolClock plugin for SongBird. Go check it
Interactive HTML5 canvas animation | PaulHamill.com
Click on the canvas to add more blobs. The colored buttons set the blob color. RND sets random color. This works in Firefox, Safari, Chrome, and iPhone browsers, but renders verrry slowwwly in Internet Explorer. This page uses HTML+Javascript without requiring any plugins such as Flash. To see how this is done, open this page and view source.
IO 9elements
Our company's top wizards, stuntmen, and industry experts offer their best advice, how-tos, and insights - all in the name of shockingly good code & design. Building a Rock Solid Auto GridExplore a customizable CSS auto-grid layout in our latest post. Adjust column widths, gaps, and max column count for flexible web designs. Ideal for any web project. Hosting a ComfyUI Workflow via APIBasic WebSoc
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
オープンソースのHTML5お絵かきウィジェット「Literally Canvas」:phpspot開発日誌
js-fireworks - JavaScript Fireworks
http://www.addyosmani.com/resources/canvasphoto/
Flickr PS3 Slideshow - lo2k
Ball Pool
bomomo