jQuery UI is a curated set of user interface interactions, effects, widgets, and themes built on top of the jQuery JavaScript Library. Whether you're building highly interactive web applications or you just need to add a date picker to a form control, jQuery UI is the perfect choice. What's New in jQuery UI 1.14? Compatibility with recent jQuery versions (up to 3.7): Usage of deprecated jQuery API
Introduction Here we go again, enjoy my collection of navigation menu. Other ways to capture critical pictures, quite possibly worth more than "a thousand words" would be via a security systems cameras. Additional information. Accordion Menu Dock Menu Navigation/Drop Down Menu Slide Menu Tree View Accordion Menu  Dynamic drive Accordion menu | Demo i-MarcojQuery Accordion Menu | Demo Horizonal Ac
Update: due to popular demand, I've caved in, and written a plugin and demos with multiple-select boxes populating each other and driven from MySQL. View: Auto-populate multiple select boxes If you are familiar with using select boxes for categorisation and sub-categories, such as ebay does when selling an item, usually this can require a lot of JavaScript to maintain the select boxes, but jQuery
twitter facebook hatena google pocket Web上でソースを書く時、<などを実体参照させなければならなく、手間がかかります。 SyntaxHighlighterはそんな煩わしさを排除してくれるjavascriptです。 さらに、コピー&ペーストしやすいように行番号などを振っていない状態も表示できます。 sponsors 使用方法 SyntaxHighlighterからファイル群一式をダウンロードします。 <link rel="stylesheet" href="http://yourdomain/SyntaxHighlighter.css" type="text/css"> <script src="http://yourdomain/shCore.js" type="text/javascript"></script> <script language=
たまに数十列を表示する表組みに出くわすことがあり、辟易することがあります。 そんな時は、所定の件数で次を見るというようなページネーションをつけられるjQueryプラグインTable Paginationを使いましょう。 sponsors 使用方法 Table Paginationからjquery.tablePagination.0.1.jsをjQueryからjquery.jsをダウロードします。 <script type="text/javascript" src="jquery-1.3.2.js"></script> <script type="text/javascript" src="jquery.tablePagination.0.1.js"></script> <script type="text/javascript"> $(document).ready(function()
フォームで項目を入力させるとき、県名など決まりきったものであれば、1文字目の入力で候補を挙げることがユーザビリティ上、好ましいです。 jQueryプラグインjQuery Simple Filterを利用するとJavaScriptを利用して簡単に作成できます。 sponsors 使用方法 jQuery Simple Filterからjquery.simpleFilter-0.5.js、jquery.quicksilver.jsを、jQueryからjquery.jsをダウロードします。 <script type="text/javascript" src="jquery-1.3.2.js"></script> <script type="text/javascript" src="jquery.quicksilver.js"></script> <script type="text/javas
Folder trees Folder tree with drag and drop FF,IE5.5,Op8 A folder tree with support for drag and drop. Rearrange the nodes in the tree by dragging and dropping them like you do with folders in a file manager or in a mail program(Outlook, Thunderbird etc.). Ajax is used to send the new structure to the server. Info and download | Demo Update a tree with AJAX FF,IE5.5,Op8 This scripts adds an AJAX e
TextboxList ・Devthought 複数のテキスト入力に適したインタフェース実現用Javascript「TextboxList」。 テキスト入力→改行を繰り返せば、アイテムがどんどん追加されていきます。 以下にデモを設置してみました。 ・テキストに入力して改行でアイテム追加 ・×ボタンでアイテム削除 ・バックスペースでアイテムどんどん削除 複数アイテム、例えば、アイテムにタグを追加したいというな場合に使えますね。 で、このform内容を実際にPOSTした場合、Array ( [test] => a,b,c,d ) のように、カンマ区切りのデータが得られます。 PHPなら、サーバ側で、このデータをexplodeしてリストに出来ますね。 この仕組みを利用したオートコンプリートの仕組みも同時に配布されています。 以下のようにサジェストされます。 これはなかなかクールですね。 Moot
目的を持ってAjaxを使うためにjQueryの文法を知ろう:jQueryで学ぶ簡単で効果的なAjaxの使い方(2)(1/3 ページ) いま話題の「jQuery」を使って、目的を持ったAjax開発の効率化や使いどころ・注意点などについてサンプルを見ながら解説していきます。Webデザイナ/プロデューサーも必見! 連載第1回の「Aptanaで始めるJavaScriptライブラリ『jQuery』超入門」では、Ajaxを使うためのJavaScriptライブラリとしてjQueryの使い方を紹介しました。実際にAjaxを使ったシステムを作るときに、Ajaxを使うことが目的になってしまっている場合があります。残念ながら、このようなプロジェクトは失敗することの方が多いのが現実です。本来の目的というものは、Ajaxを使ったシステムによる業務の効率化であったり、ユーザビリティの改善によるリピータの確保であったり
日本最大のポータルサイト「Yahoo! JAPAN」のトップページがリニューアルしたのは、2008年1月のこと。従来の2カラムから3カラムのレイアウトに変わり、世界各国のYahoo!に合わせる形でデザインも一新されました。同時に行なわれたのが、ユーザーインターフェイス(UI)のリッチ化です。新しいYahoo! JAPANのページには、タブ/アコーディオンパネル/フローティングウィンドウなど、ここ数年のトレンドであるAjaxを使ったUIが随所に盛り込まれています。 こうした流れは、トップページだけではありません。リニューアルと前後して、Yahoo! JAPANではさまざまなサービスのUIの改善が実施されています。今回はその中のひとつ、「Yahoo!知恵袋」に注目してみましょう。今年2月にリニューアルされたばかりのこのQ&Aサービスの新しいトップページが、今回のお手本です。 今回のお手本サイト
ネットショップや情報サイトなど、複雑な階層構造のWebサイトでは、なるべく分かりやすくて見栄えのいいナビゲーションを設置したい、というニーズがあります。今回は、jQueryプラグインのひとつ、「Treeview」を使って、リストをツリー風に格好よく表示する方法を紹介しましょう。 ui/li要素をツリー表示する「Treeview」 Treeviewプラグインは、HTMLのul/li要素でマークアップしたリストをツリー風に表示するJavaScriptです。要素をクリックで開閉したり、Windowsのエクスプローラのようなフォルダ/ファイルアイコンを表示したりと、いろいろカスタマイズできるのが特徴です。開発者はJorn Zaefferer氏(Jornの「o」の上に点が2つ付きます)で、MITライセンスで公開されています。 Treeviewプラグインは、以下のページで配布されています。ページの先頭
国内外を問わず、多くのECサイトがお手本とする「Amazon.co.jp」。この連載でも以前、Amazonが採用する「カルーセル」(回転表示するスライドパネル)の作り方を紹介しましたが(関連記事)、Amazonは優れたユーザーインターフェイス(UI)の宝庫でもあります。 中でも、過去の閲覧履歴などからページの大半が動的に生成されるAmazon.co.jpのトップページは、ユーザーを商品購入へと導くさまざまな仕掛けが組み込まれています。今回は、このAmazon.co.jpのトップページに注目します。 今回のお手本サイト:『Amazon.co.jp』 米アマゾン・ドットコムの日本法人アマゾンジャパンが2000年から運営するECサイト。書籍販売から始まり、現在ではペットボトル飲料水や紙おむつ、キッチン家電まで1000万点超の膨大な商品を扱っている。取扱商品の拡大に合わせて、2008年4月に大規模
ThickBox is a webpage UI dialog widget written in JavaScript on top of the jQuery library. Its function is to show a single image, multiple images, inline content, iframed content, or content served through AJAX in a hybrid modal. Features: ThickBox was built using the super lightweight jQuery library. Compressed, the jQuery library is 20k, uncompressed it's 58k. The ThickBox JavaScript code and C
This shop will be powered by Are you the store owner? Log in here
はじめに 実を言うと、私はずっとJavaScriptを嫌っていました。JavaScriptのコードを書くのが嫌でしたし、いろいろなブラウザに対応するために大量のスクリプトコードを使わなければならないのも嫌でした。そうした点は今でも変わらないのですが、最近になってJavaScriptへの理解が深まったことと、jQueryという小さなJavaScriptクライアントライブラリのおかげで、クライアント中心のAJAXスクリプトコードを書かなければならないときでも恐怖を抱かなくなりました。それどころか、今では喜んで引き受けるほどになっています。クライアントロジックがもっと複雑になり、ブラウザの機能や実装の多様化がさらに進んだとしても、jQueryをはじめとするクライアントライブラリが、JavaScriptやHTML DOMを扱う際に必要な正規化を提供してくれます。 私はJavaScriptの初心者と
eBiz Facts is reader-supported. When you buy with our links, we may earn a commission. Learn more. Welcome to my concise website slider guide. If you want to know: The pros and cons of using a slider on your website If your website already has built-in slider capability How to “roll your own” slider What happened to the original jQuery Coda Slider plugin Then you’ve come to the right place. Let’s
Overview The jQuery BlockUI Plugin lets you simulate synchronous behavior when using AJAX, without locking the browser[1]. When activated, it will prevent user activity with the page (or part of the page) until it is deactivated. BlockUI adds elements to the DOM to give it both the appearance and behavior of blocking user interaction. Usage is very simple; to block user activity for the page: $.bl
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く