Why not try a subscription?Every issue is packed with art and design inspirationDelivered to your IOS or Android deviceNever miss an issue
Notice: The WebPlatform project, supported by various stewards between 2012 and 2015, has been discontinued. This site is now available on github. New documentation can be found at MDN Web Docs. Your Web, Documented. The latest information on how to use the technology that runs the web — HTML, CSS, JavaScript and more. WebPlatform.org is a work in progress. We could use your help in making it bett
5年程前にブラウザ上で音響合成をする方法を模索していて、当時はレイテンシや負荷の問題を解決できず断念してしまったのですが、最近Web Audio APIがアツいという話を耳にして、早速試してみました。その中でもsink.jsを使うと、かなり簡単にブラウザ上での音響合成を楽しめます。まさに夢がひろがりんぐ。 Web Audio APIとは Web Audio APIは音楽アプリケーションをJavaScript上で作るためのAPIです。2010年にW3Cによって提唱されていて、最新版のChromeや開発版のSafariで既に利用可能になっています。まあ、とにかくこれを使うとブラウザ上で音楽アプリケーション(シンセサイザーとか)を作れる、というわけです。 sink.jsとは Web Audio APIを直接叩いて音響合成プログラミングをしてもいいのですが、手っ取り早くその面白さを理解するには、ラ
A jQuery plugin that uses the CSS3 image filters to replicate the tilt-shift effect. This is a proof of concept and currently only works in Chrome & Safari 6. download Download here or go to github. Released under GPL how to use Call the plugin on any collection of images you want by adding the following jQuery: jQuery(document).ready(function() { $('.tiltshift').tiltShift(); }); Parameters on eac
A tutorial on how to create a fullscreen slideshow with a twist: the idea is to slice open the current slide when navigating to the next or previous one. Using jQuery and CSS animations we can create unique slide transitions for the content elements. In this tutorial we’ll create a fullscreen slideshow with a twist: we’ll slice the current slide open in order to reveal the next or previous slide.
AngularJS support has officially ended as of January 2022. See what ending support means and read the end of life announcement. Visit angular.io for the actively supported Angular. Why AngularJS? HTML is great for declaring static documents, but it falters when we try to use it for declaring dynamic views in web-applications. AngularJS lets you extend HTML vocabulary for your application. The resu
JavaScript でアニメーションを作る アニメーションとは何? ビューを少しずつ回転、拡大縮小、移動、変色などを行い、連続的な動きを作る こんな感じ <div id="view">hoge</div> <script> var el = document.getElementById('view'); el.style.opacity = 1; setInterval(function() { el.style.opacity -= 0.01; }, 10); </script> なんで、あんな感じの書き方になるの? setInterval の意味が分からない こんな感じで書けないの? <div id="view">hoge</div> <script> var el = document.getElementById('view'); el.style.opacity = 1; w
/*! * jQuery Mobile 1.4.5 * Git HEAD hash: 68e55e78b292634d3991c795f06f5e37a512decc <> Date: Fri Oct 31 2014 17:33:30 UTC * http://jquerymobile.com * * Copyright 2010, 2014 jQuery Foundation, Inc. and othercontributors * Released under the MIT license. * http://jquery.org/license * */ /* Globals */ /* Font --------------------------------------------------------------------------------------------
impress.js is a presentation tool based on the power of CSS3 transforms and transitions in modern browsers and inspired by the idea behind prezi.com.Your browser doesn't support features required by impress.js, so are presented with simplified version of this presentation. For the best experience please use latest Chrome or Safari browser. Firefox 10 and Internet Explorer 10 should also handle it.
Turn.js is a JavaScript library that will make your content look like a real book or magazine using all the advantages of HTML5. The web is getting beautiful with new user interfaces based in HTML5; turn.js is the best fit for a magazine, book or catalog based in HTML5. <div id="flipbook"> <div class="hard"> Turn.js </div> <div class="hard"></div> <div> Page 1 </div> <div> Page 2 </div> <div> Page
MULTICOL. はHTMLで雑誌のような美しい段組みレイアウトを実現するだけのシンプルなjQueryプラグインです。 もちろん、日本製のプラグインなので日本語もきれいに段組みにします。 一 或春の日暮です。 唐の西の門の下に、ぼんやり空を仰いでいる、一人の若者がありました。 若者は名を杜子春といって、元は金持の息子でしたが、今は財産を費な身分になっているのです。 何しろその頃洛陽といえば、天下に並ぶもののない、繁昌は、まるで画のような美しさです。 しかし杜子春は相変らず、門の壁に身を凭かと思う程、かすかに白く浮んでいるのです。 「日は暮れるし、腹は減るし、その上もうどこへ行っても、泊めてくれる所はなさそうだし——こんな思いをして生きている位なら、一そ川へでも身を投げて、死んでしまった方がましかも知れない」 杜子春はひとりさっきから、こんな取りとめもないことを思いめぐらしていたのです。
HTML5とWebGL 初めにHTML5の位置づけについて簡単に触れます。HTML5とはこれまでのWebページ作成言語で主流だったHTML4やXHTMLの後継言語のことで、 2008年に草案がまとめられ、2014年までにウェブブラウザ各社への正式勧告を目指して策定が進められています。 HTML5は 2012年1月でもまだ「草案」段階で、仕様も流動的な準備段階であるが、開発側からもユーザ側からも非常に注目が集められています。 その大きな理由の一つに挙げられているのが、iPhoneやAndroidなどのスマートフォンの台頭による情報端末の多様化への対応のためです。つまり、様々なWEBコンテンツのクロスプラットフォーム化への重要な貢献が期待されているからです。 というのもスマートフォンの登場までは、Adobe社が提供する FLASH が動画やオーディオなどが組み合わされたマルチメディアコンテンツ
こんにちは。普段からiPhoneを愛用している橋本です。 最近、「せっかくiPhone持ってるんだし、iPhone向けのアプリ作ってみようかしら?」と思い立ったのですが、iPhoneのネイティブアプリを作るには、”Objective-C”と、”cocoa Touch”というiPhone/ipodTouch向けのフレームワークを理解する必要があり、また、自分で開発したアプリを実機に入れて動かしてみるには、そこそこの費用と各種手続きが必要だったり(iPhoneエミュレータ上で動かす分には問題ないのですが…)と、何かと大変です。 「何かもっと手軽にiPhone特有の機能を活かしたアプリを作る方法はないかなぁ。。」と考え、思い立ったのがWebアプリ。Webアプリなら、今までの知識+αでアプリを作成することが出来るのではないかと。そこで、今回から数回に渡ってiPhoneとjavascriptを使って
UIWebView上でJavaScriptを走らせたい場合はUIWebViewクラスのstringByEvaluatingJavaScriptFromString:メソッドを利用する。返り値には最後に評価した式の値が格納される。 以下では最後に評価された「a + b」の結果である「3」が返る。 NSString *s = [webView stringByEvaluatingJavaScriptFromString: @"var a = 1; var b = 2; a + b;"]; NSLog(@"=> %@", s); //=> 3以下はUIWebView上で選択中の文字列をNSLogで出力する例。 - (IBAction) showSelectedText { NSString *s; // 選択中の文字列を取得(なぜかtoString()しないと値が返らない) s = [webVi
Three.js basics Ilmari Heikkinen Who am I? Ilmari Heikkinen @ilmarihei | fhtr.org/plus | fhtr.org Google Chrome Developer Programs Engineer I write demos, do presentations, write articles Slides available at fhtr.org/BasicsOfThreeJS Repo at github.com/kig/BasicsOfThreeJS Three.js? Three.js is a JS 3D Engine github.com/mrdoob/three.js Lightweight Easy to use Batteries included WebGL renderer (our f
カレーうどんが好きです。今日のお昼はカレーうどんでした。正宗です。 今日はJavascriptでクラス開発をしてみたいと思います。 冒頭のカレーうどんは関係ないですね。何かいわなきゃと思ってつい好物を出してみました。 ご存じのとおり、Actionscriptはもともとバージョン1の頃はJavascriptとほぼ同じ言語であり、つまりAS1の頃のクラス開発がそのまま使える形となっています。 そこでJavascriptでクラスを作ったりするときに「あれ?ASだとこうやるやり方、JSだとどうやるんだっけ」ってのを減らせるように、完全に個人的な備忘録を作ってみました。自己流なうえにオレオレ規約ばっかりで恥ずかしい限りですがせっかく作って公開したのでなんらかのお役にたてばうれしいです。 Javascriptでのクラスの作り方は本当にたくさんの方法がありますが、その中で僕が一番馴染んでいる書き方だけを
こんにちは。毎年花粉症になりかけている飯塚です。 最近のNode.jsの普及などによってサーバサイドJavaScript界隈が盛り上がっています。 そんなホットなJavaScriptをラクにかつエレガントに書くためのCoffeeScriptという言語をチュートリアル風に紹介します。 何かしらのライブラリを自分で書く程度にJavaScriptで開発している人は絶対に使ったほうがいいと思います。 JavaScriptを知っていれば1-2時間程度で十分駆使できるようになります。 (2011/6/28:@m_satyr様にご指摘頂いた箇所を修正しました。) 目次 CoffeeScriptとは? インストール Hello World 構文 関数 変数展開 Objectの生成 ループ 存在チェック ヒアドキュメント thisのバインド クラス 無名関数 {var} Tips ?の使い分け 存在チェック
特定のページのみUIWebViewを使ってWebページを表示することはよくあると思いますが、そのページでの処理終了したタイミングで、再びネイティブコードを実行したいというケースがあります。 PhoneGapではJSからネイティブコードを呼ぶ仕組みが実現されていますが、これと似たような仕組みを作るにはどうすればよいのか紹介します。 ネイティブからWeb呼び出し JSを実行するためのメソッドがあるので任意のタイミングでそれを利用するだけでOKです。 [webView stringByEvaluatingJavaScriptFromString:@"alert('call from native');"]; 簡単ですね。 Webからネイティブ呼び出し UIWebViewDelegateにある、ページがロードされる前に呼ばれるメソッドを利用します。 - (BOOL)webView:(UIWebVi
node.jsでObjective-Cを呼び出す 今回ご紹介するモジュールは、node.jsからObjective-Cを呼び出すためのモジュール、NodObjC ※1です。 このモジュールは動的にObjective-CのフレームワークからAPIを生成するためにBridgeSupportファイルを使用します。 この仕組はJsCocoaやRubyCocoaなど、他の一般的なObjetive-CのScripting Bridge ※2とよく似ています。 Scripting BridgeはMacOSX10.5から導入されたもので Objective-Cの文法を使いアプリケーションを操作できる仕組みです。 NodObjCは内部で、Objective-Cのランタイムとやり取りするために、node-ffi ※3というモジュールを使用しています。 このモジュールはJavaScriptで動的ライブラリをロー
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く