livedoor Techブログ : 裏jQuery - 特殊なTriggerを作ってみよう
こんにちは。開発部でインターフェースエンジニアをやっております油井(あぶい)です。ライブドアでは主にjavascriptを中心としたクライアントサイド側の開発をやっております。 今回は裏jQueryと題しまして、普段から単にユーザーとして使っているだけでは決して知ることができないjQueryの裏技を紹介したいと思います。 注意 この記事で扱うjQueryは最新版の1.4で動かすことを前提としています(一つ前のバージョンである1.3.2でも動くことは検証済みです)。サンプルで使うjQueryセレクタの書き方は「jQuery」で統一しています。「$」に置き換えて読んでもらってもかまいません。 はじめに - jQueryで扱うイベントやトリガー javascriptがふんだんに使われた画面遷移の発生しないウェブアプリケーションではブラウザ上で発生するイベントやトリガーをうまく扱いこなすということ
[JS]既存のLightbox系スクリプトの不満を解決したスクリプト -Lightbox_me
IE6にも対応した、DOMエレメントをLightboxのエフェクトで表示するjQueryのプラグインを紹介します。 Lightbox_me - Stupidly Simple Lightboxing Lightbox_meは他のLigtbox系スクリプトのソリューションにはない特徴をもっています。 DOMエレメントをLightbox化。 ウインドウのリサイズ時はオーバーレイもリサイズ。 ドキュメントがウインドウよりサイズが小さい場合はオーバーレイのサイズを変更。 全てのブラウザで固定配置（fixed）で表示。 ウインドウがモーダルボックスより小さい場合は固定配置（fixed）が自動的に絶対配置（absolute）に切り替え。これによりユーザーはスクロールが可能に。 そして、軽量でシンプル、という素晴らしい特徴も備えています。 対応ブラウザはIE6+, Fx2.5+, Safari, Chr
dfltweb1.onamae.com – このドメインはお名前.comで取得されています。
このドメインは お名前.com から取得されました。 お名前.com は GMOインターネットグループ(株) が運営する国内シェアNo.1のドメイン登録サービスです。 ※表示価格は、全て税込です。 ※サービス品質維持のため、一時的に対象となる料金へ一定割合の「サービス維持調整費」を加算させていただきます。 ※1 「国内シェア」は、ICANN(インターネットのドメイン名などの資源を管理する非営利団体)の公表数値をもとに集計。gTLDが集計の対象。 日本のドメイン登録業者(レジストラ)（「ICANNがレジストラとして認定した企業」一覧（InterNIC提供）内に「Japan」の記載があるもの）を対象。 レジストラ「GMO Internet Group, Inc. d/b/a Onamae.com」のシェア値を集計。 2023年10月時点の調査。
12 Helpful jQuery Methods You Should Be Using | Envato Tuts+
Anyone who has done some web development over the last decade and a half has definitely heard about jQuery. This library did excellent work when it came to taking care of browser inconsistencies. You also had to write significantly less code compared to pure JavaScript in order to get something done. The large ecosystem of plugins around jQuery was also very helpful. The regular improvements in we
Simple jQuery Modal Window Tutorial
Introduction In this tutorial, I'm going to share how to create a simple modal window with jQuery. I like jQuery, it makes everything so simple and so easy. In case you don't know what's modal window. You can click here. That's an example of a modal window. In this website, I'm using facebox (inspiration from facebook). Others, such as lightbox, thickbox, multibox, litebox...... it's too many of t
phpのhtmlspecialcharsをJavaScriptでも使いたい！ - 桜ヶ丘日記
PHP書いたりJavaScript書いたりしてると、JavaScriptにもhtmlspecialcharsが欲しいと思いませんか？ そこでこんなふうに。 String.prototype.htmlspecialchars = function(){ return this .split('&').join('&') .split('"').join('"') .split("'").join(''') .split('<').join('<') .split('>').join('>') ; } // 利用例 var hoge = '<h1>hello!</h1>'; alert(hoge.htmlspecialchars()); 実行結果
JavaScriptのfunctionの引数にデフォルト値を設定する - 桜ヶ丘日記
こんな感じで出来ます。 引数の数が可変に出来る点も便利。 /* * 引数1: 表示メッセージ(デフォルト空文字) * 引数2: しょぼーんフラグ(デフォルトtrue) */ var msg = function() { var txt = (arguments.length > 0) ? arguments[0] : ''; var shobon = (arguments.length > 1) ? arguments[1] : true; if (txt === '') { alert('な、何か言ってよね！'); } else { if(shobon) { alert(txt + '(´・ω・｀)'); }else{ alert(txt + '(｀・ω・´)'); } } } /* 呼び出してみるテスト */ msg(); msg('しょぼん'); msg('しゃきーん', false
画像切り替えがユニークな画像スライダー実装jQueryプラグイン「Coin Slider」:phpspot開発日誌
Coin Slider: jQuery Image Slider Plugin with Unique Effects 画像切り替えがユニークな画像スライダー実装jQueryプラグイン「Coin Slider」。 画像の切替を、タイル状に切り替えたりすることができるみたいです。 jQueryプラグインなので、$(elemen).coinslider メソッドにオプション渡せば動くようになっています。 少し面白い動きを付けたい、という場合にも簡単に実装できるので覚えておくとよいかもしれませんね。 Flashで同じようにやろうとすると１からだと結構面倒そうな気がしますが、このjQueryプラグインを使うことで一瞬で実装できます。 関連エントリ 拡大の仕方がクールなLightBox実装jQueryプラグイン「YoxView」 表示法が新しくセクシーなLightBox「SexyLightBox」
jQueryプラグインとして「「JavaScript の不思議な面白さ」を再実装してみたよ。」を再実装してみたよ。 - 桜ヶ丘日記
以前書いた記事「「JavaScript の不思議な面白さ」を再実装してみたよ。」はprototype.jsで書いてみましたが、jQueryを使う機会が最近多いのでjQueryプラグインとして再実装してみました。 place holderとかinput prompt言うらしい。 jquery.inputPrompt.js js/jquery.inputPrompt.js としてこれを設置します。 /* * jquery.inputPrompt.js * set default text to <input type="text" /> * licensed under any open source license. * http://d.hatena.ne.jp/sakuragaoka/20100406 */ (function($) { $.fn.inputPrompt = functi
1日目：難しい漢字にふりがなをつけよう (1/3)
日本語は平仮名、片仮名に加えて複雑な漢字があります。漢字の読み方は思っている以上に難しく「未曾有」を「みぞうゆう」と読んでしまったり「踏襲」を「ふしゅう」と読んでしまう人もいます。人名にいたっては、もう何と読んだらよいのか分からないことも多々ありますから、学校の先生はさぞかし大変だろうと思います。 そこで、jQueryプラグイン講座1日目は、「テキスト中の読みにくい漢字にふりがなをつけるプラグイン」を作ってみましょう。すべての漢字ではなく、“読みにくい漢字だけ”（人名や地名など）にふりがなをつけてくれるプラグインです。これなら、「未曾有」を「みぞうゆう」と読み間違えてしまうことはないでしょう。 プラグインの基本形 プラグインの作成に入る前に、プラグインの基本形について説明します。jQueryでは「$()」によって複数のエレメントが操作対象となるため、プラグインには「複数のエレメント」の情報
40分で覚える！jQuery速習講座 (1/6)
いまやWeb制作に欠かせなくなったJavaScript。でも、「JavaScriptはほとんど“アリモノ”で済ませている」という方も多いのでは？ そこで、WebデザイナーやマークアップエンジニアなどのWeb制作者の方向けに、いま一番人気のJavaScriptライブラリー「jQuery」の基本を学べる特別レッスンをお届けします。題して、「40分で覚えるjQuery」。要点だけにぎゅっと絞って解説しますので、手を動かしながら今すぐjQueryを始めましょう。 【0分目：導入編】 jQueryのダウンロードと利用方法 jQueryのライブラリー本体（JavaScriptファイル）は公式サイトからダウンロードし、head要素などにscript要素を書いて読み込みます。
jQuery.suggestをIEの日本語に対応
jQuery.suggestをIEの日本語に対応 jQuery.suggestでサジェスト機能を実装しようとしたところIEでの日本語の認識が上手に行きませんでした。 調べてみたところ原因は100行目あたりの以下のコード。 } else if ($input.val().length != prevLength) { if (timeout) clearTimeout(timeout); timeout = setTimeout(suggest, options.delay); prevLength = $input.val().length; } 文字数で変化を取得しているので、たとえば「か」と入力したい場合、最初の「k」を入力した時点でサジェスト機能が動作し、「a」を入力して「か」になった段階では文字数が変わらないのでサジェスト機能が動作しない形になる。 } else if ($inpu
s3Slider jQuery plugin
Example 1 This example shows the layer appears on top or bottom. Lorem ipsum dolor Consectetuer adipiscing elit. Donec eu massa vitae arcu laoreet aliquet. Praesent Maecenas est erat, aliquam a, ornare eu, pretium nec, pede. In hac habitasse Quisque ipsum est, fermentum quis, sodales nec, consectetuer sed, quam. Nulla feugiat lacinia odio. Fusce rhoncus Praesent pellentesque nibh sed nibh. Sed ac
[JS]セレクトボックスにアイコンを配置してグラフィカルにするスクリプト -image combobox
セレクトボックスの各アイテムにアイコンを配置して、グラフィカルに認識しやすくするスクリプトをMarghoob Sulemanから紹介します。
JSでアニメーションするならコレかもというぐらい多機能な「GX」ライブラリ:phpspot開発日誌
GX - Full-Featured Javascript Animations Framework JSでアニメーションするならコレかもというぐらい多機能な「GX」ライブラリ。 jQueryと組み合わせて使うアニメーションライブラリです。 jQueryやscript.aculo.usにもアニメーション機能は備わっているけど、ここまでではないというアニメーションに特化したアドオンです。 勿論、jQuery単体でも、組み合わせて実現できるのかもしれませんがアニメーションに特化している分簡単に出来ます。 以下でその凄さが分かるはず $('#el1').gx({'width': 200, 'height': 200, 'border-width': 8}, 2000, 'Linear', function(el) { el.html('Completed!'); });
JavaScript なスライダーライブラリのまとめ
自分用の備忘録としてですが JavaScript なスライダーライブラリのまとめです。 音量の設定とか RGB での色設定とか感覚的な数値を入力させるためのＵＩとしてぴったりなアレです。今流行のページスライダーではありません。一昔前は Flash で作られたライブラリが多かった記憶がありますが、最近では JavaScript でもできちゃいますって感じで様々なライブラリが公開されています。 Javascriptでできているスライダーありませんかね？ の人力検索はてなの情報を大いに参考にさせて頂きました。 基本的な考え方として、見た目は各種パーツの画像を作り込むことでどうにでも変更できます。機能的には有名どころの JavaScript ライブラリを用いていればそれほど不満が出ることも無いかと思うので、現状お使いのライブラリの系列のものを使うとムダにメモリ使用量とかライブラリ同士での汚染とか考
[JS]jQueryのプラグイン33+1選 -2009年3月
紹介済みから未紹介のものまで、jQueryのプラグイン34選です。 jquery.scrollable ホイール・クリック・キーボード操作にも対応した、パネルをスクロールする高性能なスクリプト。 Fi
リッチで使いやすいＵＩを作成するためのjQueryライブラリ＆サンプル集:phpspot開発日誌
45 New jQuery Techniques For Good User Experience | Developer's Toolbox | Smashing Magazine リッチで使いやすいＵＩを作成するためのjQueryライブラリ＆サンプル集。 JSフレームワークはもうjQueryの時代だと言わんばかりの豊富かつ有用なサンプルが多数掲載されています。 Build A Login Form With jQuery Spoiler Revealer with jQuery AJAX Upload FCBKcomplete Create Accessible Charts Using Canvas and jQuery Radio Button and Check Box Replacement Submit a Form without a Page Refresh jQuery
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
[JS]簡単に設置ができるmp3プレイヤーのスクリプト -jPlayer
CSS Lecture: Google AJAX APIを使ってjQueryやPrototypeを読み込む