|
|
新着サンプル
行数:
|
◆ CSS3でボックスを3Dの円球に変える
(#1)
このサンプルは、CSS3のスタイルシート(radial gradient overlays)を利用してボックスを3Dの円球に変えます。このサンプルは、Firefox, Safari/Chrome用に最適化されています。IE8で表示すると円が四角になります。
|
◆ Google Earthに検索窓に入力した場所を表示する
(#2)
このサンプルは、Google Earthに検索窓に入力した住所の場所を表示します。サンプルが表示されたら、検索窓に住所(例:東京都板橋区中丸町)を入力して[Fly Here!]ボタンをクリックします。すると、Google Earthに入力した住所が表示されます。
|
◆ セレクタで選択した要素が存在するかどうか調べる
(#3)
このサンプルは、jQueryのセレクタで要素を検索したときに要素が存在するかどうかをチェックします。そして、要素が存在するときは背景色を書き換えます。
サンプルが表示されたら[Run !]ボタンをクリックしてください。div1とdiv3要素の背景色が変わります。div2の要素は見つからないので背景色が変わりません。
|
◆ イメージをフェイドアウト/フェイドインさせて切り替える
(#4)
このサンプルは、jQueryのfadeIn/fadeOutメソッドを利用してイメージをフェイドアウト/フェイドインさせながら切り替えます。サンプルが表示されたら[FadeOut/FadeIn Image !]ボタンをクリックしてください。イメージがフェイドしながら切り替わります。
|
◆ HTML要素をセンタリングする
(#5)
このサンプルは、jQueryのcenterプラグインを利用して任意のhtml要素をセンタリングして表示します。サンプルが表示されたら、[Run!]ボタンをクリックしてください。赤のボックスが画面の中央に移動します。
|
◆ Google Mapsにクライアントの住んでいる場所を表示する
(#6)
このサンプルは、Google Maps v3にクライアント(訪問者)が住んでいる場所をデフォルトで表示します。サンプルが表示されるとGoogle Maps上に、あなたが住んでいる場所(ipアドレスから取得)にマーカーを表示します。マーカーをクリックすると情報ウィンドウに「住所」、「緯度/経度」、「IPアドレス」を表示します。
|
◆ jQuery: IPアドレスから住所と緯度/経度を取得する
(#7)
このサンプルは、クライアントのipアドレスから住所と経度/緯度を取得して表示します。サンプルが表示されると、クライアントの住所、ipアドレス、緯度、経度が表示されます。
|
◆ jQuery: クライアントのIPアドレスを取得する
(#8)
このサンプルは、「jsonip.appspot.com」が提供するRESTfullサービスを利用してクライアントのipアドレスを取得して表示します。
|
◆ jQuery: マウスの右クリックを無効にする
(#9)
このサンプルは、jQueryのbind()でcontextmenuイベントを拾ってマウスの右クリックを無効にします。サンプルが表示されたらマウスを移動して右クリックしてみてください。コンテキストメニューが無効になります。
|
◆ 複数列のスライド型メニュー
(#10)
このサンプルは、CSS3のスタイルシートを適用して複数列のスライド型メニューを表示します。マウスをトップメニューに移動すると複数列のサブメニューが上下にスライドして表示されます。このサンプルは、 SafariとGoolge Chromeに最適化されています。Firefoxの場合、サブメニューがスライドされません。IEの場合、メニューがフラットの状態で表示されます。
|
|