DOM2Texture: Abusing Arcane APIs — surma.dev
When using OpenGL (or WebGL), you have to do everything yourself, including font rendering and layouting. I thought: “Wouldn’t it be great if you could just reuse the browser’s layouting and font-rendering engine instead of heaving to reinvent the wheel?”. Yes, but there’s no API for that. Or is there? TL;DR: You can use <foreignObject> to embed normal HTML content in an SVG, encode that SVG as a
60fps on the mobile web — Flipboard Engineering
Flipboard launched during the dawn of the smartphone and tablet as a mobile-first experience, allowing us to rethink content layout principles from the web for a more elegant user experience on a variety of touchscreen form factors. Now we’re coming full circle and bringing Flipboard to the web. Much of what we do at Flipboard has value independent of what device it’s consumed on: curating the bes
第三回CreateJS勉強会に参加しました | 技術ブログ | 株式会社リンクアット・ジャパン
5/10に開催された第三回CreateJS勉強会に参加しました。 以下メモです。 はじめてのCreateJS＋パーティクル 原 広行さん FlashCS6でまずは簡単なアニメーションを作る。 それをToolkit for CreateJSで書き出し。 シェイプをjsで描画するコードが書き出される。 シェイプなので拡大したり回転させてもビットマップのように汚くならない！ パーティクルエンジンはParticleEmitterJSを使用。 GUIエディタもあるよ。 PCではサクサクだが、モバイル環境ではパーティクルの表示は厳しい（4fps… ・発表スライド ・発表デモ Toolkit for CreateJSでの書き出しで各種アセットはすべてビットマップになると勝手に思っていたけどちゃんとシェイプとして書き出されるとはじめて知りました。 WindowsストアアプリでCreatejsをこう使う 阿
lake.js
How does it work? Like this: <script src="jquery.js"></script> <script src="lake.js"></script> <script> $(function() { $('#lake-img').lake({ 'speed': 1, 'scale': 0.5, 'waves': 10 }); }); </script> ... <img id="lake-img" src="lake.png" style="display: none;"/> Lake.js takes an img element and inserts a canvas element displaying the image and its flipped reflection directly after the img element. Th
JavaScript 3DレンダリングエンジンのThree.jsを試す
こんにちは。 KRAYアルバイトの浅海です。 今回は、最近ちまたで噂のThree.jsで遊んでみようとおもいます。 http://github.com/mrdoob/three.js webgl対応のブラウザで見ている方は、右上に3Dのボックスが表示されていると思います。 Three.jsを使えば、このようなことを簡単にJavascriptで実現できるのです。 半信半疑で使ってみたところ、たしかにThree.jsでは、3D特有の行列計算や数学的思考をせずとも、3Dを表示、操作することができました。 「ちょっとのプログラムで3Dができる。」 この面白さを皆さんに届けたいです。 目次 立方体を表示する 光をあてる テスクチャを貼り付ける マウスで回転させる マウスで移動させる クリック判定する Three.js web上には、HTML5のcanvasを利用した様々なサンプルページやアプリケーシ
KineticJS
KineticJS is a fast, robust, HTML5 Canvas Library that is no longer maintained. The last stable version is v5.1.0, and it's pretty darn solid. You can find the github project here. I am also no longer maintaining the CDN which hosted KineticJS files. If your site was using KineticJS hosted on Amazon's S3 CDN services, I'm very sorry for having to pull the plug, but it was getting very costly. For
web.dev
Stay organized with collections Save and categorize content based on your preferences. Explore our growing collection of courses on key web design and development subjects. An industry expert has written each course, helped by members of the Chrome team. Follow the modules sequentially, or dip into the topics you most want to learn about.
CanvasタグとJavaScriptで3Dのデモを作ってみました | ClockMaker Blog
HTML5というわけではないですが、CavasタグとJavaScriptを使って3Dのデモを作ってみました。 デモを見る ソースコード (［右クリック］→［ソースを見る］を選択) こういうのを見れば「HTML5すごい、Flashいらない」と思う人もいるかもですが、冷静にファーストインプレッションを。同じものを以前Flashで実装したことがありますが（Papervision3D演出サンプルNo.01:羽ばたく蝶々）、両者のデモを比較することでメリット・デメリットが見えてきます。 ＜追記：2013年9月3日＞ Three.jsの最新版rev 60にアップデートしてみました。3年前に作成したときはrev 17だったのですが、別物のライブラリと言わんばかりにほとんどAPIが変わってしまっています。ちなみにTypeScriptで書きなおしています。 デモを見る ソースコード (TypeScript)
これは見ておくべきHTML5のCanvasを使ったデモ集:phpspot開発日誌
21 Ridiculously Impressive HTML5 Canvas Experiments | Nettuts これは見ておくべきHTML5のCanvasを使った実験集。 ここまで出来るの？っていうサンプルが満載で一度は見ておきたいものばかりです。 8 Bit Color Cycle Particle Letter Animation Particle System Strange Attractors Liquid Particles Fake Floor Reflections 次世代のWEBが楽しみです。 関連エントリ HTML5で動画や音声再生を可能にするライブラリ集 HTML5ベースのTODOリスト「5List」 CSSでクールにデザインされたHTML5動画・音楽プレイヤー実装JS「MediaElement.js」 CSSでスキン作成が可能なHTML5動画プレイヤー実
John Resig - Processing.js
As a sort-of reverse birthday present I’ve decided to release one of my largest projects, in recent memory. This is the project that I’ve been alluding to for quite some time now: I’ve ported the Processing visualization language to JavaScript, using the Canvas element. I’ve been working on this project, off-and-on now, for the past 7 months – it’s been a fun, and quite rewarding, challenge. The f
Opera News
AI New AI Feature Drop: Opera One Developer gets a new Aria access point and now... March 14th, 2024 In this week’s AI Feature Drop, early adopters using the Developer stream of Opera One can test using the Aria... AI, Opera for Android Opera for Android 81 now comes with Ask Aria and Aria Voice features for improved... March 13th, 2024 Opera for Android 81 introduces Ask Aria and Aria Voice, enha
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
CreateJS | A suite of JavaScript libraries and tools designed for working with HTML5
Appcelerator Developer Center - API for (version 1.6.2)
http://accelart.jp/shibuyajs/logo/logo.html