iframeで埋め込んだYouTube動画をJavaScriptで操作。
iframeで埋め込んだYouTube動画の再生・停止などを、自サイトにはIFrame Player APIのファイルを組み込まずにJavaScriptで動的に操作する方法のメモ。 iframeで取得表示されたYouTubeのwindowオブジェクトを取得し、postMessage()メソッドでAPIのコマンドを送信して操作する。 埋め込むiframeにJavaScript APIの使用を許可するパラメーターを付与。 iframe内で表示している外部サイト(YouTube)のwindowオブジェクトを取得。 取得したwindowオブジェクトにpostMessageメソッドでAPIのコマンドを送信。 HTMLに埋め込みコードとコントローラー要素を記述 iframeの埋め込みコードにAPIの使用を許可するパラメーター「enablejsapi=1」を付与する。このパラメーターを付与しない場合、デ
iOS で click イベントがわけのわからない動作をする件について - Qiita
iPhone や iPad などでも、 JavaScript の click イベントは基本的に有効です。 しかし、これらのデバイスで click イベントを拾おうとすると、うまくいかないことがあります。 このあたり、結構わけのわからない仕様になっているので、順を追って説明します。 なお、以下の説明では jQuery 1.9以上の使用を前提としています。 どういうときにうまくいかないか とりあえず、以下のHTMLを前提とします。 ... <body> <p id="child1">...</p> <p id="child2">...</p> </body> ...
JavaScript入門講座
今日の内容 JavaScriptを勉強し始めくらいの人を対象にしたJavaScript入門講座的なもの 文法とかは調べればわかるのでふれません 一人で勉強してもわからなそうな概念などを重点的に説明します ライブコーディングするのでJavaScriptってこんな感じて作るんだなーというのがわかってもらえればと アジェンダ JavaScriptを勉強する前に JavaScriptの基礎知識 ライブコーディング part1 jQueryの基礎知識 ライブコーディング part2
Animating with CSS Transitions · jQuery Masonry
Ut condimentum mi vel tellus. Suspendisse laoreet. Fusce ut est sed dolor gravida convallis. Morbi vitae ante. Vivamus ultrices luctus nunc. Suspendisse et dolor. Etiam dignissim. Proin malesuada adipiscing lacus. Donec metus. Curabitur gravida. Phasellus pede arcu, dapibus eu, fermentum et, dapibus sed, urna. Sed ac risus. Phasellus lacinia, magna a ullamcorper laoreet, lectus arcu pulvinar risus
Online JavaScript beautifier
End script and style with newline? Support e4x/jsx syntax Use comma-first list style? Detect packers and obfuscators? (unsafe) Preserve inline braces/code blocks? Keep array indentation? Break lines on chained methods? Space before conditional: "if(x)" / "if (x)" Unescape printable chars encoded as \xNN or \uNNNN? Use JSLint-happy formatting tweaks? Indent <head> and <body> sections? Keep indentat
透過PNGや角丸などをIE6や7でも実装出来るJavaScriptのメモ - かちびと.net
IE6のPNG透過や6、7での 角丸、ドロップシャドウを実装 するjsライブラリのまとめです。 同じ用途でもライブラリによっ て良し悪しだと思いますので、 備忘録的にメモ。 もうIEはいいよとも思いますが、現実そうも行かないのはもどかしいですね。万能では無いですけど、作業工数を減らせるならjsに頼ってもいいと思います。そういう訳で、透過の問題や角丸、ドロップシャドウを実装してくれるjsのメモ。 IE7.js IE6以下でもIE7と同じようなXHTML / CSSの解釈をしてくれます。要DOCTYPE 宣言。 IE6以下をWeb標準に準拠させるライブラリ『IE7.js』 DD_belatedPNG.js IE6でも透過PNGを実装できるライブラリ。class名等を指定します。リピートにも対応。 IE6用透過png対応策、DD_belatedPNGの使用法と注意点 合わせて読みたい：DD_be
[JS]設置も簡単なテーブルのデータをソートする超軽量のスクリプト | コリス
leigeberから、既存のテーブルにも簡単に設置できる、データをソートする超軽量（1.7KB）のスクリプトを紹介します。 jQueryやPrototypeなど他のスクリプトは必要ありません。 JavaScript Table Sorter demo 動作確認ブラウザは、IE 6/7/8, Fx2/3, Op, Safari, Chromeとなっています。 設置方法は簡単で、既存のものにも簡単に組み込めます。 「script.js」と「style.css」を外部ファイルとして記述します。 tableに「class="sortable" id="sorter"」を記述します。 テーブルの下に下記のスクリプトを記述します。 <textarea name="code" class="html" cols="60" rows="5"> <script type="text/javascript">
Adobe - デベロッパーセンター : 外部APIを使用したFlashとJavaScriptの接続 ExternalInterfaceクラス
Jeong-Heon Kim Adobe 目次 はじめに Flash Player 8のセキュリティ変更 Flash 8以前の接続メソッド ExternalInterfaceクラス ExternalInterface.call() ExternalInterface.addCallback() 印刷用に表示 作成日:2006年6月12日 ユーザレベル:中級 Flashアプリケーションで何らかの機能を使おうとすると、HTMLページ内のJavaScriptのような、Flash Playerの外部にあるコードに接続しなければならないことがよくあります。このような場合、接続を行うにはActionScriptからJavaScriptを呼び出したり、あるいはその逆を行うといったことが必要です。 Flash Player 7以前のバージョンではActionScriptとJavaSc
Comet/Ajaxの上を行く技術 - Blog by Sadayuki Furuhashi
上を行くかどうかは知りませんが :-p Ajaxはクライアントの都合でサーバーに通信を仕掛けるpull型の通信ができ、Cometはサーバーが好きなタイミングでクライアントへデータを送りつけるpush型の通信ができるわけですが、新たに双方向の通信ができる技術を開発しました。 具体的には、JavaScriptとサーバーの間で双方向のRPCができます。すなわち、サーバーからクライアント側のJavaScriptのメソッドが呼べるし、逆にクライアント側からサーバー側のメソッドを呼ぶこともできます。 サーバー側で call("addMessage", "Hello!") とやると、JavaScript側の function addMessage(msg) { ... } という関数が呼ばれたりします。 この技術を使って、試しにチャットシステムを作ってみました ＞ デモ （ソースコード）*1 リアルタイ
二度押し防止の onsubmit で disable にするやつ :: Drk7jp
もう２年ほど前に話題になったアレなんですけど、今更ながらあるサービスでこの仕組みの導入を検討しています。 onsubmit で submit ボタンを disable にしてユーザビリティを良くする - naoyaのはてなダイアリー submit ボタン disable 技の罠 - naoyaのはてなダイアリー onsubmit で submit ボタンを < disable にしてユーザビリティを悪くするのはやめてください - のヮの うんこ♥ onsubmit で disable にするやつ - 鷹の島 onsubmit の disable 化ですが既に議論が終わっているように、onsubmit disable の実装方法として、 onsubmit イベント発生時に submit 要素を disable にして値をサーバへ渡すための hidden 要素を生成する方法 setTimeou
このページの先頭へ、をちょこっとおしゃれに | S i M P L E * S i M P L E
ブログでもサイトでもよく見る「このページの先頭へ」のリンク。長～いページだとそのリンクで一瞬に先頭に行ってしまい、読んでいる人が混乱することもよくあります。 そこでご紹介したいのが「するするるーーー」と先頭まで戻ってくれるJavascript。このブログでも導入してありますので是非体験してみてください。 ↑ ページの下の方でこの「↑」を押すとするすると上まで戻ります。 導入方法は簡単でJavascriptを導入し、「このページの先頭へ」リンクにonClickイベントを仕込むだけです。 仕込むJavascriptはこちら。ちなみに元ネタは「A (slightly) better technique for “Back to Top” links.」です。ページ内に書き込んでも、外部ファイルにしてもいいでしょう。 function backToTop() { var x1 = x2 = x3
JAVASCRIPT MOTION TWEEN
TweenConstructorMethodsExampleEasing functionsExampleEventsEvents listenersColorTweenConstructorExampleOpacityTweenConstructorExampleTextTweenConstructorExampleSequenceMethodsEventsUsageExampleParallelSee it in action The Tween class CONSTRUCTOR var t = new Tween(object,property,easing,start,end,duration,suffixe); object: type:Object The object you want to modify. It can be any object, a visual ob
[JS]jQueryのプラグイン33+1選 -2008年1月 | コリス
紹介済みから未紹介のものまで、jQueryのプラグイン34選です。 jqzoom 画像の一部をズーム。 Shadowbox 複数のJavaScriptライブラリに対応したLightbox。 Faceb
JavaScript: 世界で最も誤解されたプログラミング言語 - 実用
翻訳 原文:JavaScript: The World’s Most Misunderstood Programming LanguageCopyright 2001 Douglas Crockford. All Rights Reserved Wrrrldwide. JavaScript(別名：Mocha、LiveScript、JScript、ECMAScript)は、世界で最も人気のあるプログラミング言語の一つです。世界中のほとんどのパソコンには、少なくとも1つはJavaScriptインタープリタがインストールされ動いていることでしょう。JavaScriptは、WWWのスクリプト言語としての確かな地位により広く利用されるようになったのです。 しかしその高い普及率にもかかわらず、JavaScriptが汎用的でダイナミックな優れたオブジェクト指向プログラミング言語であることはあまり知られて
JavaScript開発ツールの本命！ FirebugとAptana（1/3） − ＠IT
JavaScript開発ツールの本命！ FirebugとAptana：どこまでできる？ 無料ツールでWebサイト作成（4）（1/3 ページ） ついに「Aptana STUDIO」がリリース 先日、連載第1回と第2回で紹介したAptanaが、2年にわたる開発期間を経て「Aptana STUDIO 1.0」としてリリースされた。 「Aptana STUDIO 1.0」には、「Community Edition」と呼ばれるフリー版と、「Professional Edition」と呼ばれる製品版が存在し、製品版は1年間の更新と優先的なサポート、最新開発版へのアクセスパスが付いて199ドル（現在はセール中？）で、以降更新のために1年ごとに79ドル、というプランが用意されている。Professional EditionはIE（Internet Explorer）のデバッグサポート、JSONエディタ、S
JavaScript-XPath をリリースしました！さあ、あなたも XPath を使おう！（解説付き） - IT戦記
JavaScript-XPath とは JavaScript-XPath は、 DOM 3 XPath を実装していないブラウザに対して、実用的な速度で動作する DOM 3 XPath のエンジンを追加します。 一言で乱暴に言ってしまえば、どのブラウザでも document.evaluate って関数で XPath 使えるようになるよ！ってことです。 以下が公式サイトになります。 http://coderepos.org/share/wiki/JavaScript-XPath DOM 3 XPath ってなんなの！？ めっちゃ簡単（で、ちょっとだけ適当）なDOM 3 XPath の説明をします＞＜。 JavaScript でよく使う document.getElementById や document.getElementsByTagName って関数ありますよね？ DOM 3 XPath
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
anime.js
ボタンを綺麗に修飾してくれるライブラリ「sexybuttons」:phpspot開発日誌
ashikunep.org
ie7-js - A JavaScript library to make MSIE behave like a standards-compliant browser. - Google Project Hosting