
実装側では非常に苦労しますが、使い勝手は抜群。わざわざnew演算子を使ってインスタンス生成をしなくても関数の戻り値としてオブジェクトを使うテクニックです。 例を使って説明します。以下はDOMの操作で要素を削除する方法です。 普通の方法 var elem = document.getElementById('navi'); elem.parentNode.removeChild(elem); DOMのAPIでは直接要素を削除できません。いったんparentNodeをたどり、removeChildでDOMツリーから削除します。 普通のクラス化 var Elem = function(id){ this.elem=document.getElementById(id); }; Elem.prototype.remove = function(){ this.elem.parentNode.rem
概要 リンクの内容からファビコン (Favicon)のURLを自動判断し、画像を挿入します。 ダウンロード jQuery.gpFavicon-1.0.zip [57KB] 基本的な使い方 .gpFavicon()を実行するとその中からリンクを探してURLを解釈し、ファビコンを表示させます。画面全てのリンクを対象にする場合は$(document)に対して実行します。 $(document).gpFavicon(); $(elem).gpFavicon(); また個別のリンクに対して .gpFavicon()を実行すると、そのリンクだけを対象にファビコンを表示します。 $(link).gpFavicon(); デモ デモ1 : 基本的なもの Demo 1 各リンクにファビコンを表示させます。 ファビコンが見つからない場合はデフォルトのアイコンを表示します。 自身のサイトにはファビコンは表示しま
こんにちは、2011年度新卒エンジニアの夏目です!突然ですがみなさんJavaScript書いてますか? 最近はjQuery Mobileなどを利用したスマートフォン向けアプリ開発において、クライアントサイドでもヘビーなJavaScriptのコーディングをする機会があると思います。そのようなときコードのいたるところにHTMLが混入したり、どこでどのデータを扱っているのか分からなくなるということになりがちです。 今回はそんな悪夢のようなコーディング生活に一筋の希望の光を照らすBackbone.jsを紹介したいと思います。 対象読者 JavaScriptでの開発経験がある方 Backbone.jsとは Backbone.jsはDocumentCloudが開発をしている、クライアントサイドのJavaScriptコードをModel、View、Controllerで構築するためのフレームワークです。b
August 18, 2010 13:25 カテゴリAJAXWEB全般 今どきのIE用PNG透過事情まとめ Posted by okappu No Comments No Trackbacks Tweet 気になったのでIEのためだけに気になったので現状どんな感じなのかまとめ。 ただ、見るサイト、見るサイトで適当な説明も多く設置方法読むとunitなのにタイトルはpngfix,jsとか…。 まとめてみようと思ったけど…まとまらず。 やはり百聞は一見に… 自分で使ってみないことにはわからないことは多々ありますが全体的に眺めた結果。 DDbelatePNG今のところ一番無難な感じ ■iepngfix.js ・AlphaImageLoaderフィルターを使用するので、描画処理自体は遅く、メモリも大きく消費する。 ・AlphaImageLoaderフィルター使用時の致命的バグである「適応ブロック内の
引き続きJavaScript をいじっています。 勝手が違って悶えていますが、だいぶ慣れてきました。 jQuery のすばらしさにしびれていたらまんまとハマった点について。 ■やりたいこと フェードアウト後にそのエレメントを削除 ■うまくいかない式 $('#some_element').fadeOut(300).remove(); //エレメントは、フェードアウトせず、すぐに消える。 ■原因 キューに入るメソッドと入らないメソッドがあるため。 ■説明 1) jQuery クラスのメソッドは、戻り値として自身のオブジェクトを返してくれるので、続けて処理したいメソッドは続けて記述できる(= メソッドチェーン)。 2) エフェクトに分類されるメソッドのほとんどは、一旦キューに溜まってから実行されるため、前のエフェクトの終了を待って動いてくれる。 3) 1) と 2) は互い
ホーム ポートフォリオ ブログ シフトは高品質なWebサイトのデザイン・制作をしています。クリーンで美しいデザイン、魅力的なユーザー体験、目的達成のためのプロセス、代表的なブラウザへの完全対応。これらを満たしたサイトを生み出すことを愛してやみません。Webサイトを通じて、誰もがよき方向へシフトする可能性を常に探し続けています。
jQuery hashchange eventを使ったWordPressテーマを作成してみました。 デモサイトはコチラ 一応HashLogなんていうそのまんまな名前です。 Ver0.1というアルファバージョンです。一応CSS周りはIE7までOKのはずです。 WordPress3以上対応です。 制作の元ネタにでもして頂けたらと思います。 ダウンロードはこちらからどうぞ。 hashlog これだけではちょっとあれなのでJS周りのソースを張っておきます。 [php] <script type="text/javascript" src="<?php bloginfo( ‘stylesheet_directory’ ); ?>/js/jquery.ba-hashchange.min.js"></script> <script type="text/javascript" src="<?php bl
We are happy to inform you that version 5.8.9 of Guriddo jqGrid JavaScript is available for download. This release is big step forward of changing the jqGrid. As first we have rewritten the Forzen Columns and Frozen Rows modules. Now they can be used together and a lot of problems regarding these are resolved. Another step forwar is a true fix of the virtual scrolling. Now the module work stable.
ばらけてきたのでこちらにまとめます。 索引 位置の設定 css(name,value) 位置の取得 css(name) offset() position() scrollTop() / scrollLeft() event.pageY / event.pageX サイズの設定 css(name,value) / height(value) / width(value) サイズの取得 css(name) / height() / width() attr(clientHeight / offsetHeight / scrollHeight) outerHeight() / innerHeight() コンテナ要素の取得 offsetParent() 解説 位置の設定 css(name,value) 対象要素を指定した位置に配置できます。単位を省略した場合はピクセル単位となります。 $('#
Fork on GitHub Demo: Simple Context Menu Example code: Simple Context Menu Example HTML: Simple Context Menu jQuery Context Menu Demo Gallery right click me Example code: Simple Context Menu Example HTML: Simple Context Menu jQuery Context Menu Demo Gallery Simple Context Menu Context Menu on DOM Element Adding new Context Menu Triggers Create Context Menu on demand Create Context Menu (asynchrono
複数の画像のスクロールのタイミングをずらして表示するパララックスを簡単に実装できるjQueryのプラグインを紹介します。 jQuery.Smart3D デモページ [ad#ad-2] パララックスはそれぞれのタイミングをずらして視差効果を生み出し、奥行き感を出すものです。 上記デモでは背景と人物の画像2枚をそれぞれマウスに合わせてずらして表示しています。 使用画像 5枚の画像を使用したパララックス Smart3Dの実装 一番最初に紹介したデモの実装方法です。 HTML 各画像をリスト要素で配置します。 <ul id="mindscape"> <li><img src=".../mindscape1.png" /></li> <li><img src=".../mindscape2.png" /></li> </ul> CSS スタイルシートでサイズを設定し、好みでborderなどのデザイン
Document Data Structure in MongoDB Express MongoDB lets you easily store structured and unstructured data in a flexible and dynamic database schema. It supports CRUD operations on complex data objects using JSON as the main data type. Its an open source solution so it may not be as robust or well supported as commercial management tools. However it is easy to deploy and works well for most use cas
爱恋2015,偷窥丶自由丶性别,忘穿内裤坐公交车被揉到高潮,欧美熟妇搡bbbb搡bbbb,女人私密肥大图片,最好看免费视频在线观看,女人被躁到高潮嗷嗷叫网站,超碰在线视频
指をスライドさせてページ送りをしたりするスワイプという操作ですが、自分のWebサイトにもコレを使うと簡単に導入できそうです。 <div id="swipeBox" ontouchstart="touchStart(event,'swipeBox');" ontouchend="touchEnd(event);" ontouchmove="touchMove(event);" ontouchcancel="touchCancel(event);"> ↑こんな感じね。(うーん、見慣れないイベントだw) で、動作デモがこちら(iPadで見てね)> Swipe Example なんで、こんなモヤモヤっとした表現かというと、iPadが無いんです。試せないんです。デモサイトは当然Chromeちゃんでは動きませんでした。Android端末からなら動くのかな?iPad頂戴。 というわけで、詳しい解説は、↓
JavaScriptライブラリのjQueryのプラグインを利用して出来るサンプルです。 jQueryは、John Resig によって開発されたJavascriptライブラリで、AjaxやDOMプログラミングコードを「簡潔・簡単」に書けます。 ここでは、画像関連のjQueryプラグインを紹介しています。 JSONファイルから画像スライダーを作成するjQueryプラグイン「jsonslider」 JSONファイルに画像パスなどのデータが格納されている場合、処理を入れて画像スライダーにするのはそれなりの手間です。 jQueryプラグインのdcdeiv/jsonslider · GitHubを利用することでその手間が少し軽減できるかもしれません。 via:dcdeiv/jsonslider
見せ方、UIがスマートな画像スライダーJavaScriptを紹介します。 jQueryプラグインMobilySliderです。 sponsors 使用方法 mobily.pl - playground - MobilySliderからファイル一式をダウンロードします。 <link href="default.css" rel="stylesheet" type="text/css" /> <script src="jquery-1.4.4.min.js" type="text/javascript"></script> <script src="mobilyslider.js" type="text/javascript"></script> <script> $(document).ready(function(){ $('.class名1').mobilyslider({ conten
前回 は、「Creating Responsive Applications Using jQuery Deferred and Promises」 の記事と jQuery のリファレンスを翻訳し、Deferred の解説をお届けしました。が、今一歩、Deferred オブジェクトの うれしさ をお伝えできていなかったように思います。今回はその反省をふまえ、単なる翻訳ではなく、元記事の文脈に沿って、Deferred オブジェクトをどのように使うと/何がうれしくて/どうしあわせになるのか、私が学習して得た事をお伝えしたいと思います。 今回は、4本の jsfiddle を記事に埋め込んでいます。jsfiddle 上で自由に編集してテストしてもらえばうれしいのですが、4本すべて実行すると1.4MBものリソースを読み込む事になり、ブラウザに優しくありません。すぐに タブや をクリックせずに、 タブ
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く