Important: PhantomJS development is suspended until further notice (more details). PhantomJS is a headless web browser scriptable with JavaScript. It runs on Windows, macOS, Linux, and FreeBSD. Using QtWebKit as the back-end, it offers fast and native support for various web standards: DOM handling, CSS selector, JSON, Canvas, and SVG. The following simple script for PhantomJS loads Google homepag
スタイルシート(CSS3)でDIV要素を回転して表示するサンプルを書いてみた。 JavaScript で DOM element の style プロパティ経由で transform や transformOrigin プロパティをセットしている。 ⇒ locating and transforming by JavaScript and CSS 以下のウェブブラウザで動作確認済み。 - Mozilla Firefox 6 - Google Chrome 13 - Apple Safari 5.1 - Microsoft Internet Explorer 9 - Opera 11.50 IE9 は Windows Vista 上で、それ以外は Windows XP 上で動作するのを確認。 サンプルコードの中身。 <!DOCTYPE html> <html> <head> <meta ch
もともとは存在しなかったタグ要素を新たに追加したり、変更、削除するテクニックを学ぶ。こうした処理ができるのはDOMならではの魅力だ。 旧来のDHTMLの手法では、JavaScriptから操作できるHTML要素には限りがありましたが、DOMでは、HTML上のありとあらゆる要素を自由自在に読み取ったり、書き換えることができるようになります。本連載では、主にDOM Level 1で規定されている手法を使い、JavaScriptでどのようにHTML上の要素へアクセスするのか、そして、それをどうやって書き換えるのかを詳しく解説します。これにより、JavaScriptからHTML要素を手に取るように操れるようになります。 DOMスクリプティングでは、HTMLをJavaScriptから自由自在に書き換えられる点が大きな魅力です。これまで、HTMLに存在する要素の参照方法や属性の扱い方を学んできましたが、
Grow in your career and unlock new opportunities by learning in-demand skills in AI, data, coding, cybersecurity, and more. Transform your team with Codecademy Teams trainingHelp everyone on your team build job-ready skills with a plan that offers flexible content assignment, progress tracking, and more.
この連載について † この連載では、マウスでグリグリ動かす日本地図を”無”から作成します。 デモはこちら スクロール地図自体はAjaxは必要無しですが、現在表示されている地図に関する情報を引き出すときにはやはりAjax技術は役立ちます。*1 すでに高品質の地図がたくさんありますが、Ajaxに取り組む者の”嗜み”として作っておきます。 この研究はよくあるマッシュアップじゃないです。ゼロからスクロール地図を作るんです。 地図画像上をマウスでグリグリとスクロールしてみてください。 地名データはスクロールに応じてAjaxで非同期に取得して表示しています。 ↓作りかけのAjaxスクロールマップ↓ マウスでスクロールできます!地名で検索もできます。 Please see here by browsers dealing with iframe tag. Go to http://demo
Google Chrome でAjaxを利用しローカルファイルにアクセスする Google Chrome5.0.335以降でどうやらローカルファイへのアクセスポリシーが変更されており、AjaxのXMLHttpRequest でローカルのHTMLなどからローカルファイルにアクセスが出来なくなってしまったようです。[5.0.335 Update] ローカルサーバーなどを立てて開発している場合は問題ないんですが、たんなるローカルファイルとして開発しているとやっかいですね。 解決方法としては、Google Chromeの起動オプションに次のコードを追加します。 -allow-file-access-from-files 起動オプションはWindowsですと、アプリのショートカットアイコンを右クリックしてプロパティを選択、リンク先を次のように変更することで付加できます。 C:\Users\...(中
Copyright Notice Copyright © 2000 World Wide Web Consortium, (Massachusetts Institute of Technology, Institut National de Recherche en Informatique et en Automatique, Keio University). All Rights Reserved. This document is published under the W3C Document Copyright Notice and License. The bindings within this document are published under the W3C Software Copyright Notice and License. The software
ドキュメントオブジェクトモデル (Document Object Model, DOM) は、ウェブページを表す HTML のような文書の構造をメモリー内に表現することで、ウェブページとスクリプトやプログラミング言語を接続するものです。ふつうは JavaScript を使用しますが、HTML、SVG、XML などの文書をオブジェクトとしてモデリングすることはコア JavaScript 言語の一部ではありません。 DOM は文書を論理的なツリーで表現します。ツリーのそれぞれの枝はノードで終わっており、それぞれのノードがオブジェクトを含んでいます。 DOM のメソッドでプログラム的にツリーにアクセスできます。これにより、文書構造やスタイルやコンテンツを変更することができます。 ノードにはイベントハンドラーを割り当てることができます。イベントが発生すると、イベントハンドラーが実行されます。 DO
HTML5で手軽に扱えるようになったSVG(Scalable Vector Graphics)。前回は、Inline SVG(インラインSVG)で基本的な図形を描く方法を解説しました。今回は、HTML5文書内に埋め込まれたインラインSVGをJavaScriptで制御します。 JavaScriptでSVG要素にアクセスする 最初に、制御対象となるSVGデータを作成しましょう。JavaScriptで制御したいSVG要素にはid属性を記述し、ID名を付けておきます。通常のHTMLタグ(要素)にID名を指定する場合とまったく同じです。たとえば<rect>(四角形)を制御したい場合は以下のように記述します(ID名は任意)。 <svg> <rect id="myBox" x="0" y="0" fill="red" width="100" height="80" /> </svg> ID名を指定してお
《2017年6月8日 3:30 PM 公開/更新》 指定範囲の整数からランダムに1つを選ぶ方法 [計算・変換] JavaScriptを使って指定範囲の中からランダムな整数を得るには、Math.random()を使って乱数を得て、欲しい最大値の数値(の1つ上)を掛けてから、Math.floor()で小数点以下を切り捨てます。とても簡単です。 指定範囲の整数からランダムに1つを選ぶ方法 0~99の範囲でランダムな整数を1つ得るサンプル 1~12の範囲でランダムな整数を1つ得るサンプル 指定範囲の整数からランダムに1つを選ぶ方法 JavaScriptには、実行するたびにランダムな数値を得るrandomメソッドが用意されています。これを使うと、指定範囲の中でランダムな数値を簡単に得ることができます。 ランダムに何かを選択するとか、おみくじを作るとか、何かの当選番号を決定するとか、いろいろ活用できそ
マクラ JavaScriptを使っている人なら知っていることだろうけど、JavaScriptはプロトタイプベースのオブジェクト指向を採用しているので「クラス」がない。オブジェクトしかない。 でも、組み込みの演算子としてnewがあって、それを使って var obj = new Object(); とか書けちゃう。クラスってものはJavaScriptにはないはずなのに、new ClassName();と書くとあたかもClassNameクラスのオブジェクトのインスタンスが生成され、それが返ってくるかのような挙動をしている。 これは気持ち悪い。言語仕様としてはクラスは本来存在しないのに、クラスのようなものが導入されている。まともな神経を持った人間なら、一体new演算子って何なの?という疑問を持つのが当たり前である。「{}はnew Object()のシンタックスシュガーです」とか言ってふんぞり返って
a small library for generating and manipulating CSS 3D transforms NOTICE: This page is slowly getting outdated. In my spare time, I've been working on a major syntax revision, Firefox compatibility issues and a new version of this page. Until I get the time to finish all of this, here's a list of the most up to date resources : "v2" branch on github (featuring a simplified syntax) A more recent li
Ti.include('lib/oauth_adapter.js'); var oAuthAdapter = new OAuthAdapter( 'YOUR CONSUMER SECRET', 'YOUR CONSUMER KEY', 'HMAC-SHA1' ); // load the access token for the service (if previously saved) oAuthAdapter.loadAccessToken('twitter'); //OAuth if need. if (oAuthAdapter.isAuthorized() == false) { var receivePin = function() { oAuthAdapter.getAccessToken('https://api.twitter.com/oauth/access_token'
最近、twitter クライアントを Firefox 拡張機能として作ったりしているのですが、twitter では認証方式として OAuth が採用されているため、JavaScript で OAuth 認証を行う必要があります。 ここでは、JavaScript の OAuth ライブラリを用いて OAuth 認証を行う方法を説明します。 OAuth 自体の詳しい説明などは OAuth の公式サイト をご覧ください。 OAuth ライブラリの入手 Google code に OAuth 関連ライブラリのプロジェクトサイト があります。 ここで、John Kristian さん作の JavaScript 用のライブラリも公開されています。 JavaScript 用 oauth ライブラリ Revision 1249 の段階では、ライブラリとして使用するのに必要なファイルは以下の 2 つのファイ
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く