ビールとポップコーンと映画 ラストマイルを見た。良い映画だった。 映画館でべそべそ泣いて、鼻を啜りながら車で帰った。感想はこのブログでは書かない。みんな映画館に行って感じてみてほしい。 帰ってからツイッターで感想を漁り、うんうん、わかるわかる、そうだよね、とまた映画を思い出して…
404 Not Found お探しのファイルは見つからないようです。 お手数ですが、下記リンクからトップページへお戻りください。 CoolWebWindow Copyright (C) Cool Web Window All Rights Reserved
基本 jQueryとは jQuery は様々な処理を短く簡単に書ける JavaScript ライブラリです. 独自のXPATH/CSSセレクタを利用することで,多くのDOM操作を非常に簡単に書くことが出来ます. JavaScriptのDOM操作や,XMLHTTPRequest,XMLの操作などを覚えなくとも, Ajaxを利用したインタラクティブなページを作ることが出来ます. 以下のサンプルを見れば,JavaScriptらしい表記をほとんどする必要がないことがわかると思います. toggleサンプル 特定のブロックの表示・非表示を切り替えるのは以下のようなコードになります. $("#target_toggle").toggle("slow"); このブロックは,<p id="target_toggle"> です. Ajaxサンプル Ajaxでhello.htmlをロードするのは以下のようなコ
属性とはhtmlでいうと要素で設定しているいろいろな値、 例えば:<a href="index.html"></a> 属性:href、属性値:index.html、要素:a 属性を変更できると、画像を入れ替えたり、urlを変更したり、大きさを変えたり、ホームページでの表現の幅が広がります。 attr 属性値を変更する場合 $("セレクタ").attr("変更したい属性の名前","変更後の属性値"); 例えば、 属性srcをa.jpg→b.jpgに変更する場合。 jquery $("img").attr("src","b.jpg"); html 変更前:<img src="a.jpg"> 変更後:<img src="b.jpg"> さらにたくさんの属性を変更したい時 $("セレクタ").attr({"属性名":"変更後の属性値","属性名2":"変更後の属性値"}); が使えます。 例えば、
jquery.ui を使えば、美しいタブ切り替えをあっという間に作成可能です。 uiを導入していないとき、あまりあれこれ入れたくないとき、美しくなくていいとき(?)など、何かしらの事情がある場合は、jqueryだけで十分です。 <html> <head> <meta http-equiv="content-type" content="text/html; charset=utf-8" /> <title>jQueryだけでタブ切り替えサンプル</title> <style type="text/css"> /* タブっぽく並べて */ #tabs ul {list-style:none;} #tabs li {float:left; width:150px;} #tabs a {display:block; margin:5px; border:1px solid #ccc; paddi
Equalbox.js デモページ [ad#ad-2] Equalbox.jsの実装 HTML 各div要素はjQueryのセレクタで指定できるように、idなどを指定します。 <div id="box-container"> <div id="box1" class="box"> <p>dsfsdfsdfsdf</p> <p>dsfsdfsdfsdf</p> <p>dsfsdfsdfsdf</p> <p>dsfsdfsdfsdf</p> <p>dsfsdfsdfsdf</p> </div> <div id="box2" class="box"> <p>dsfsdfsdfsdf</p> </div> <div id="box3" class="box"> <p>dsfsdfsdfsdf</p> <p>dsfsdfsdfsdf</p> <p>dsfsdfsdfsdf</p> <p>dsfsdf
heatmap.jsはWebベースのヒートマップ表示ライブラリ。 heatmap.jsはHTML5/JavaScript製のオープンソース・ソフトウェア。グラフには様々な種類があるが、とりわけ作るのが難しそうなグラフにヒートマップがある。一定の範囲における影響度を表現したり、ユーザの動きを可視化するのに使われたりする。 デモ 動線を可視化することによってサイトの流れを変えたり、店の商品配置を変えるデータにもなりえる。そんなヒートマップを表示するためのライブラリがheatmap.jsだ。 heatmap.jsはWebブラウザ上で指定した範囲(画像など)の上にヒートマップを表示するライブラリだ。マウスの動きに合わせたり、クリックでヒートマップデータを作ることが出来る。クリック場所をトラッキングしておけば、元データを集積することができるだろう。 地図との組み合わせ 画像だけでなく、地図の上にレイ
HTML5にはオフラインアプリケーション機能があり、オフラインに対応したWebサイトを作ることができます。Webブラウザでいちど表示させれば、あとはネットワークとの接続が切れてもそのままエラーを起こさずに利用し続けられるWebサイトです。 iPod TouchやiPhoneに搭載されているWebブラウザの「Safari」はHTML5のオフラインアプリケーション機能に対応しているそうなので、HTML5を使っていつでも参照できる超簡単なアプリを作れるのではないか、そう思ってお正月休みに試してみることにしました。 単に路線図を表示するだけのアプリ iPod Touchを僕は利用しているのですが、いつでも参照できる地下鉄の路線図があるといいなと思っていました。iPod TouchはWifi機能しかないため、外出中はずっとオフラインでの利用なのです。 そこで、起動すると路線図の画像を表示するだけの超
Chrome Experiments is a showcase of work by coders who are pushing the boundaries of web technology, creating beautiful, unique web experiences. You'll find helpful links throughout the site for creating your own experiments, and you can also explore resources like WebGL Globe and our workshop of tools.
ヒートマップとは ヒートマップとは、温度を色で表すサーモグラフィーと同様に、ユーザーが注目している閲覧場所を赤緑青といった色で可視化する技術です。ユーザーのページ内行動を、マウスの動きから推定しています。 たとえば、 「ページをどこまで読み進めたのか(終了エリア)」「ページのどの位置を長く読んだのか(熟読エリア)」「ページのどの位置をクリックしたのか(クリックエリア)」を見える化します。これを利用すると、「読んでほしいのに読まれなかった箇所」、「意外とクリックされているリンクやボタン」「クリックしてほしいのにされていないリンクやボタン」などを発見でき、従来のページビュー(PV)やユニークユーザー数(UU数)などのアクセス解析だけではわからなかった改善点を、素早く浮き彫りにできます。 終了エリア 熟読エリア クリックエリア ヒートマップのメリットはどんなものですか? ヒートマップツールを使う
Javascript Page Slider?Roundup - CSS-Tricks “Page Sliders” are a bit like Tabbed Boxes, only the content appears to slide by instead of be instantly replaced. JavaScriptでページスライダー用ライブラリいろいろ。 小さい範囲に複数のアイテムを格納したい場合に使えるスライダー用ライブラリがいくつか紹介されていました。 Coda Slider Step Carousel Viewer Simulates a Flash Horizontal Navigational Effect jCarousel Carousel Component - YUI カッコいいだけでなく、省スペース、ということで色々なところで活用できそうですね。
JavaScript::Bookmarklet スクリプト集:このページで紹介しているスクリプトは自由にお使いください。 更新日:2006.10.27 [blog] このページは様々な用途で利用できるBookmarkletをご紹介しています。もしこのページで紹介しているBookmarkletが気にいったら是非このページをあなたのホームページとリンクしてください。そしてもっと多くの人にBookmarkletのおもしろさを伝えてください。リンクに許可は必要ありません。またこのページで紹介しているBookmarkletの多くは海外サイトで紹介されているコピーフリーなものです。ですから自由にコピーして使ってください。 ニュース&お知らせ 6月27日:「カウンタ」を追加しました。 3月18日:「DOMのソースを見る」を追加しました。 1月26日:「nofollow属性のリンクを強調」を追加しました。
JavaScriptには、大きく分けて次のの演算子があります。 四則演算を示す 「算術演算子」、数値をビットとして扱う 「ビット演算子」、条件を扱う 「論理演算子」、数値の大小を比較する 「比較演算子」、そして演算の結果を変数に代入する 「代入演算子」などが挙げられます。 ■ 算術演算子 加算、滅算、乗算、除算、および除算の余りを求める演算子です。数値の計算に使用します。なお、日常的な計算においては、 11 + 8 = 19 のように使用しますが、JavaScriptでは多くの場合、代入演算子を使用して、 a = 11 + 8; のように変数に計算の結果を代入します。
変数 var に値 exp を代入します。イコール(=)は等しいという意味ではなく代入するという意味を持ちます。 xx = 5; // xx に 5 を代入する yy = xx; // yy に xx の値(= 5)を代入する zz = "ABC"; // zz に文字列"ABC"を代入する 例えば、次の例を数学的に解釈すると「解無し」となってしまいますが、JavaScript ではこれを「xx という変数に、xx の値と 2 を足したものを代入する」という意味になります。あらかじめ xx に 5 が代入されていれば、xx は 7 となります。
MathクラスのMathメソッド、プロパティはおみくじを作ったり、数字をランダムに発生させたり、絶対値を求めたりする事ができます。クラスを始めて聞いた方も多いと思いますので、少しクラスについても説明しますが、まだクラスを理解していなくても大丈夫です。 右のswfファイルを見てください。簡単に説明しますと、Mathクラスという箱の中には全てのMathメソッドが入っています。Mathメソッドを使う時はこのMathクラスという箱の中から呼び出して使用しています。Mathクラスは数学的な事を行う部品が詰め込まれています。ちなみにplay(); stop(); getURL();などが入ってるクラスはMovieClipクラスです。 ↓少し難しく説明↓ ここは飛ばして読んでもいいです。 クラスはオブジェクト(部品)を定義するものであり、例えばStringクラスで作成されたオブジェクトはString型に
紹介済みから未紹介のものまで、jQueryのプラグイン34選です。 前回のjQueryのプラグイン33+1選 -2007年9月と合わせて、参考ください。 lightbox for jQuery jQu
【リスト】 <form> ここは、おすすめ! → <input type="button" value="Tatsuya's Home Page" onClick="window.open('http://www.red.oit-net.jp/tatsuya/index.htm')"> </form> <form> ここは、おすすめ! → <input type="button" value="Tatsuya's Home Page" onClick="window.open('http://www.red.oit-net.jp/tatsuya/index.htm')"> </form> 【説明】 新しくウィンドウを開くのは、window.open() を使います。 open( ) のパラメータにURLを指定すれば新しいウィンドウを作ってそこにリンク先をロードします。 例)
■ JavaScript目次 JavaScriptを覚えて、ページに変化を表現することは楽しいことでもあります。ユーザ環境に配慮しつつ上手にスクリプトを使ってみましょう。あらたなコンピューター言語を覚えることは大変なことです。特に初心者にとっては、初めて目にする言葉が続出します。当講座ですべてをマスターすることは困難と思います。自分が新しいことにチャレンジすることは、それなりの情熱と覚悟を持って自分なりに努力することも大切なことです。あくまでも参考程度でお読みいただければ幸いです。 なお、サンプルを含めてJavaScriptに関する記述に重大な誤りやミスがありましたら、メールにて、ご連絡いただけると大変助かります。 ■ JavaScriptリファレンス オブジェクトリファレンス メソッド、及びプロパティリファレンス JavaScript Color Name ビルトイン関数 言語仕様 演算
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く