JSTweenerでアニメーション - MacBook Airにミルクとチーズを
JSTweenerを使ってスライドしてみようと思ったものの、 AS3でTweener使ってたときの感覚で書いたら巧くいかなかったのでメモを。 思い通りに動かなかったコードは次のもの。 var element = document.getElementById('hoge'); element.style.position = 'absolute'; element.style.left = '1024px'; JSTweener.addTween(element, { time: 2, transition: 'linear', left: 0 }); 実行結果は、アニメーションはなく、2秒後に0pxに移りました。 何故これでアニメーションにならないか。 AS3のときはこれでいけたじゃないか！ leftの値が文字列で保存されてるからなのか？(原因は未確認) なんてことを思いながらしばらく嵌
CodeRepos::Share – Trac
JSTweener JSTweener is tween library for JavaScript. JSTweener's API like Tweener. download http://coderepos.org/share/browser/lang/javascript/jstweener/trunk/ http://coderepos.org/share/browser/lang/javascript/jstweener/trunk/src/JSTweener.js subversion svn co http://svn.coderepos.org/share/lang/javascript/jstweener/trunk/ jstweener transitions JSTweener's transitions is Tweener's easing function
CoffeeScriptってなんぞ？
kanazawa.js v1.7 - Back to Basics -（2012年3月31日開催）で使用したスライドです。
[JavaScript] IE6,IE7のgetAttributeとsetAttributeについて | Blog | Development Reference
javascriptライブラリを作成していて、あれ動かない？と思うとこれが原因の事が未だにあるため、忘れないようにメモしておく。 IE6,7では、getAttribute と setAttribute を使用して、class 属性や style 属性などを操作できないバグ（IEの仕様）がある。 以下、一部の例を記載する。 element.setAttribute("class","○○○"); → element.setAttribute("className","○○○"); element.setAttribute("style", "○○○"); → element.style.cssText = "○○○"; element.setAttribute("maxlength", 5); → element.setAttribute("maxLength", 5); element.s
– このドメインはお名前.comで取得されています。
このドメインは お名前.com から取得されました。 お名前.com は GMOインターネット(株) が運営する国内シェアNo.1のドメイン登録サービスです。 ※表示価格は、全て税込です。 ※サービス品質維持のため、一時的に対象となる料金へ一定割合の「サービス維持調整費」を加算させていただきます。 ※1 「国内シェア」は、ICANN(インターネットのドメイン名などの資源を管理する非営利団体)の公表数値をもとに集計。gTLDが集計の対象。 日本のドメイン登録業者(レジストラ)（「ICANNがレジストラとして認定した企業」一覧（InterNIC提供）内に「Japan」の記載があるもの）を対象。 レジストラ「GMO Internet Group, Inc. d/b/a Onamae.com」のシェア値を集計。 2024年5月時点の調査。
クロージャでaddEventListenerしたEventをremoveするメモ
クロージャでaddEventListenerしたEventをremoveするメモ arguments.callee を使う。 Docs[argument] arguments オブジェクトは、関数の引数の保存や、引数へのアクセスに使用されます。関数の本体に含まれる場合、arguments オブジェクトにはローカルの arguments 変数を使用してアクセスできます。 var count:Number = 0 addEventListener(Event.ENTER_FRAME, function():void { count++ if(count > 10){ removeEventListener(Event.ENTER_FRAME,arguments.callee); } } 以下、使ってみたsample クロージャの中でイベントを削除する - wonderfl build flas
【Javascript】配列の値の中から、最大値、最小値を求める（配列を引数に展開する） at softelメモ
問題 Javascriptで、数値の配列から、最大値、最小値を求めよ。 答え var a = [3, 1, 4, 1, 5, 9, 2, 6]; Math.max.apply(null, a); // → 9 Math.min.apply(null, a); // → 1 補足 何が起きているのか。 Math.max(5, 7) // → 7 Math.max(5, 7, 4, 9, 1) // → 9 Math.max は可変長の引数をとります Math.max([5, 7, 4, 9, 1]) // → NaN そもそもダメです Math.max.apply(null, [5, 7, 4, 9, 1]) // → 9 OKです applyの第一引数は何でもよい。結果は変わらない。 Math.max.apply({}, [5, 7, 4, 9, 1]) // → 9 OKです Math.
HTML5演出に最適な複数画像読み込み管理のJSライブラリ「LoadManager.js」 | ClockMaker Blog
HTMLで複数の画像を読み込むとき、HTMLのimgタグだけだと不恰好となりがちですが、読み込みを管理すれば見栄えも整いますというデモとJSライブラリを作ってみました。次の2つのデモを見比べて何が違うのか確認ください。 デモ (通常のimgタグ) デモ (LoadManager.jsを使用) デモの違いとは 前者は画像がバラバラとインターレース的に読み込まれ、後者は読み込み終わるまでローディングが表示され読み込まれたものがフェードインして表示されます。 ▼前者のデモ ▼後者のデモ 後者のデモには、ローディングのパーセンテージ表示も付いています。読み込みが何%まで達しているかを確認できるのも、後述のJSライブラリのメリットです。 HTML5で作られたフルFlash的なサイトを見たときにimgタグでインターレース的に画像がバラバラとでてくることが多くて、いつも微妙な思いをしていました。Flas
HTML5でテキストのシャッフル演出ができるJSライブラリ「ShuffleText.js」 | ClockMaker Blog
Flashでよく見かけるテキストシャッフル演出(文字列がランダムで切り替わる演出、正しい呼び名はわかりませんｗ)をHTML5で作ってみました。HTMLのタグ(pタグとか)に使うバージョンと、HTML5の新要素Canvasを使うバージョンの二種類を用意しました。 【2017年4月26日 追記】 【重要】JSライブラリーはGitHubで更新しています。使用したい方は次のGitHubのリポジトリを御覧ください。 Canvas版はCreateJS 2015年版でも動作するよう更新しました。 デモ demo (HTMLエレメント版) demo (Canvas版) ソースコードはMITライセンスで公開してしますので、個人・商用問わずご自由にお使いください。 ShuffleText.js (HTMLエレメント版) ShuffleEaselText.js (Canvas版) それでは以下で使い方を紹介して
Web系雑記: JavaScriptで3桁区切りのカンマ
(11/15)HTML5プロフェッショナル認定試験レベル1に合格しました (11/08)Windows10でエクスプローラーで開いてるフォルダをコマンドプロンプトで開くのが楽になった (02/16)CatalystでスタックMACアドレスの扱いが機種ごとにどう違うか (02/02)もう一つのSDN? Simple Defined Networkingとは (02/02)RealtekのNICでタグVLANのタグをパケットキャプチャで確認する (11/06)Windows標準で使用できる正規表現対応エディタとして「PowerShell ISE」という選択肢 (09/09)OpenFlow超初心者が最初の1週間で読んだ本たち (08/21)Catalystのdefineコマンドを使ってみた 一般(75) (X)HTML+CSS(5) JavaScript(12) UI・デザイン(6) Unix
YouTube Data APIで取得可能なフィード｜YouTubeAPI｜音声・動画配信（ストリーミング）｜PHP & JavaScript Room
動画検索のクエリ パラメータ[vq」〔検索キーワードを指定〕 動画検索のクエリ パラメータ「alt」〔フォーマット指定〕 動画検索のクエリ パラメータ「author」〔特定のユーザーを指定〕 動画検索のクエリ パラメータ「max-results」〔最大取得数指定〕 動画検索のクエリ パラメータ「start-index」〔取得位置指定〕 動画検索のクエリ パラメータ「lr」〔地域指定〕 動画検索のクエリ パラメータ「orderby」〔動画の並び替え〕 動画検索のクエリ パラメータ「time」〔アップされた期間指定〕 「関連動画フィード」を取得して表示 標準フィード：「評価の高い動画フィード」を取得して表示〔top_rated〕 標準フィード：「お気に入り登録の多い動画フィード」を取得して表示〔top_favorites〕 標準フィード：「人気の動画フィード」を取得して表示〔most_view
HTML5 Canvasを始めよう：EaselJSとTweenJSでテキストエフェクト | ClockMaker Blog
HTML5のCanvasをFlashライクに使えるようにするJavaScriptライブラリ「EaselJS」と「TweenJS」を使ってデモを作ってみました。 demo 今回のブログ記事では「EaselJS」と「TweenJS」の使い方をデモの作り方を通して紹介します。 ライブラリの紹介 「EaselJS」と「TweenJS」はFlashのエンジニアとして著名なGrant Skinner氏が開発しているJavaScriptライブラリです。「EaselJS」がHTML5 CanvasをFlashライクに使うためのライブラリで、「TweenJS」が汎用的なトゥイーンライブラリです。 ▲EaselJS HTML5のCanvas要素はHTML上に自由に描画することのできる新しい要素で、工夫することでFlashのように豊かな表現を作ることができます。ただCanvasではJavaScriptでちょっと
Events in JavaScript
The following table contains the complete list of events, their browser support and the associated event objects. If you need the event objects in a hierarchical form, see the page for the Event interface. Bubbles Cancelable Event object Name that can be used for the addEventListener, removeEventListener and event initialization (initEvent, ...) methods. Name that can be used for event attributes
[スマートフォン]ヘッダーを固定配置にするJavaScript | サイブリッジラボブログ
はじめまして、今回初登場のアシスタントデザイナーのまこっちゃんです。 今後ともよろしくお願いいたします。 最近はスマートフォンサイト制作全盛期ですよね。今後はスマートフォンでリッチなサイトが、現れるのではないかとわくわくしています。 今回は、スマートフォンサイト制作中に躓いた固定ヘッダーにつきまして、『固定ヘッダーのJavaScriptは何がベストか』を考えていきます。 Mobile Webkit では【position:fixed;】が効かない！ 皆さんもPCサイトで一度は固定ヘッダーのサイトを制作された事があるかと思いますが、スマートフォンサイト制作で試された方もいらっしゃるのではないでしょうか。 PCサイトの固定ヘッダーで使用される【position:fixed;】がiPhone・iPadなどでは効かないという問題点に気をつけましょう。 iscroll まず、スマートフォン向けに使わ
![[スマートフォン]ヘッダーを固定配置にするJavaScript | サイブリッジラボブログ](https://cdn-ak-scissors.b.st-hatena.com/image/square/e82e2c864f8e014b0448593dedfe46486c4e1fd5/height=288;version=1;width=512/http%3A%2F%2Fwww.cybridge.jp%2Fimg%2Fcommon%2Flogo_cybridge_m.gif)
John Resig - DOM insertAdjacentHTML
The method is only available on DOM elements (which makes sense) and is easy to use: var ul = document.getElementById("list"); ul.insertAdjacentHTML("beforeEnd", "<li>A new li on the list.</li>"); ul.insertAdjacentHTML("beforeEnd", "<li>Another li!</li>"); At first glance the method appeared to work well and seemed to be relatively fast. Two questions remained, though: How fast is it in comparison
ActionScript入門Wiki - Arctic.js
AS3ライクに記述できるJavaScriptゲームライブラリです。(ライセンスはMIT License) ダウンロード - https://github.com/DeNADev/Arctic.js <html> <head> <script type="text/javascript" src="js/arctic.js"></script> <script type="text/javascript" src="js/game.js"></script> </head> <body> <canvas id="canvas"></canvas> </body> </html> (function() { // arcGameクラスを継承したメインクラス var Main = arc.Class.create(arc.Game, { // コンストラクタ(必要なら引数を指定) initial
新しいことをしたいならチェックしておきたい、最近のJavaScriptライブラリ
「crocro.jscam」JavaScript... / 3D野郎は寄ってたかれ!WebGLでグリグリ遊べ... / jmpress.js | a jQuery pl...他...全6件
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Minify JavaScript files online
Dart programming language
JS フォームの未入力をチェックする