enchant.jsでクォータビュー - jsdo.it - Share JavaScript, HTML5 and CSS
箱庭系のゲームを作ってみたいので、 enchant.jsでクォータービューの練習。 マス１つをGroupにして、 キャラクターをそのGroupに追加・削除で奥行きを表現。 あと、ドラッグ（スワイプ）で画面移動。 //マップデータ var map_data = { "data" : [1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 2, 3, 3, 3, 3, 3, 3, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 2, 3, 3, 3, 3, 3, 3, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 2, 3, 3, 3, 3, 3, 3, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 2, 3, 3, 3, 3, 3, 3, 2, 2, 2, 2, 2, 2,
Three.js で音楽のビジュアライズを試してみるテスト（その４） - jsdo.it - Share JavaScript, HTML5 and CSS
Three.js で音楽のビジュアライズを試してみるテスト（その４） ＜対応した点＞ ・TimeDomainData と FrequencyData の両方を表示するよう対応。 getByteTimeDomainData(Uint8Array array) … Uint8Array に信号の生データを取得する。 getByteFrequencyData(Uint8Array array) … Unit8Array にスペクトル情報を取得する。 ・「stop」ボタンを追加。 ＜変更履歴＞ 2015/03/20 音声データをogg形式→mp3形式に変更 2014-08-03 初版 ＜参考＞ ■ Canvas で音楽のビジュアライズを試してみるテスト（その２） http://jsdo.it/cx20/etk3 // forked from cx20's "Three.js で音楽のビジュアライズ
CSS謝罪文 - jsdo.it - Share JavaScript, HTML5 and CSS
CSSによるインデックスされない謝罪文 CSSに本文が書いてあるので、画面上は表示されているがGoogleでのキーワード検索には引っかからない 「流出」などの嫌な単語は:beforeと:afterに「流」「出」を分けて書くことで、自然言語解析を回避 #s { p:first-child { font-weight: bold; font-size: 120%; } p:not(:first-child) { text-indent: 1em; } p:nth-child(1):before{ content: "お 詫"; } p:nth-child(1):after{ content: " び"; } p:nth-child(2):before{ content: "平素は弊社のサービスをご利用いただき、誠にありがとうございます。"; } p:nth-child(3):before{ c
カラムレイアウトって結局どうやって作る？ - jsdo.it - Share JavaScript, HTML5 and CSS
カラムレイアウトって結局どうやって作る？ position ? float? table-cell ? positionを使って内容物にabsoluteを付けると、 wrapper要素の高さがなくなってしまうのでカラムはpositionよりfloatを使おう。 http://www.mdn.co.jp/di/articles/517/?page=13 table-cellは楽だけど、min-heightやpositionが効かないので、これはこれでハマりそう。 http://blog.livedoor.jp/p_eq/archives/54429518.html IEを抜かせれば、display: boxが便利かな http://www.css-lecture.com/log/css3/css3-layout-box.html http://versionfive.jp/2009/06/n
地理院地図(地理院タイル)を Google Maps Javascript API v3 で表示する例 - jsdo.it - Share JavaScript, HTML5 and CSS
Google Map Javascript API v3 を使って、地理院地図(地理院タイル)表示するための、もっともシンプルなコードです。 see also - http://amay077.github.io/blog/2013/10/11/denshikokudo-on-googlemap/ <!DOCTYPE html> <html> <head> <style type="text/css"> html { height: 100% } body { height: 100%; margin: 0px; padding: 0px } #map { height: 100% } </style> <script src="http://maps.google.com/maps/api/js?v=3&sensor=false" type="text/javascript" chars
devicePixelRatio確認会場 - jsdo.it - Share JavaScript, HTML5 and CSS
AndroidのdevicePixelRatioが1.5で混乱を巻き起こしたのは記憶に新しいが、 フルHD端末がdevicePixelRatio 3であることが判明。 1, 1〜2の間, 2, (2〜3の間) 3 devicePixelRatio=3のフルHD端末… XperiaZ, ARROWS X, HTC One, HTC J butterfly HTL21 <div id="info"> devicePixelRatio: <script> document.write(window.devicePixelRatio); </script> </div> <h1>等倍</h1> <div><img src="http://jsrun.it/assets/z/d/8/6/zd860.png" alt=""></div> <h1>1.5倍</h1> <div><img src="htt
クリックしてカードをめくる - jsdo.it - Share JavaScript, HTML5 and CSS
(function($){ $.fn.rotate_box = function(){ var elm = $(this), elm_in = $('.inner', this), btn = $('.face, .back', elm), deg = 0, turn = false, turn_cls = 'reverse'; var rotate_anm = function(){ elm_in.css({ 'transform' : 'rotateY(' + deg * -2 + 'deg)' }); }; var rotate = function(){ setTimeout(function(){ rotate_anm(); if( deg == 45 ){ if( turn === false ){ elm.addClass(turn_cls); } else { elm.re
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
無限スクロール - jsdo.it - Share JavaScript, HTML5 and CSS
Google App Engineでメール送信 - jsdo.it - Share JavaScript, HTML5 and CSS
Google Static Maps API 確認用 - jsdo.it - Share JavaScript, HTML5 and CSS
GPSで距離取得と2点間の距離計算 ver2.1 - jsdo.it - Share JavaScript, HTML5 and CSS
Geolocation APIつかってみた - jsdo.it - Share JavaScript, HTML5 and CSS
localStorageの有効状態を確認する - jsdo.it - Share JavaScript, HTML5 and CSS
コンテンツが少ない場合でもフッターを下のほうに表示する（少し扱いやすくしたバージョン） - jsdo.it - Share JavaScript, HTML5 and CSS
Function.prototype.bindの、複数の引数を配列で渡せるバージョン - jsdo.it - Share JavaScript, HTML5 and CSS
画面の幅によってテーブルの列の表示・非表示を切り替える - jsdo.it - Share JavaScript, HTML5 and CSS
ホワイトスペースによる隙間を取り除く方法 - jsdo.it - Share JavaScript, HTML5 and CSS
onDeviceOrientationの値の取得 - jsdo.it - Share JavaScript, HTML5 and CSS
スクロールイベントの視覚化 - jsdo.it - Share JavaScript, HTML5 and CSS
Chrome transform:rotate の背景画像のがたつき対応 - jsdo.it - Share JavaScript, HTML5 and CSS