IBM Developer is your one-stop location for getting hands-on training and learning in-demand skills on relevant technologies such as generative AI, data science, AI, and open source.
最新のライブラリーやJavaScriptの新しい活用法を紹介する「JavaScriptラボ」。今回は、9月末にリリースされたばかりの「YUI 3(Yahoo! UI Library Version 3)」を取り上げます。 Yahoo! UI Libraryとは? 「Yahoo! UI Library」(以降、YUI)はその名の通り、ユーザーインターフェース周りを得意とする米ヤフー製のAjaxライブラリーです。YUIは、Ajaxが普及し始めた2005年に登場し、面倒なUI周りを簡単に処理できることから次第に普及していきました。実は、以前取り上げたAjaxフレームワーク「Ext JS」も、もともとはYUIの機能拡張(Extension)として生まれたものです。 YUIはタブパネルやスライダー、ドラッグ&ドロップ、アニメーション機能など、他のライブラリーやフレームワークを凌ぐ充実したUI部品と豊
サーバーサイドフレームワークを使ってWebアプリケーションを開発するJava開発者の中には、JavaScriptの専門的知識が乏しくてリッチなユーザーインターフェイスを作成できない人が少なくありません。このギャップを埋めるためにThe Yahoo! User Interface Library(YUI)を活用しましょう。 はじめに The Yahoo! User Interface Library (YUI)はAJAXベースのリッチなユーザーインターフェースを開発するためのオープンソースのJavaScriptライブラリです。新しいYahoo! MailではYUIが使われているので、このライブラリがいかに強力なものか想像できるでしょう。本稿は3回シリーズの1回目です。このシリーズの主な対象読者は、JavaScriptの専門知識はあまりないけれども、サーバーサイドフレームワーク(JavaSer
ヤフー株式会社は、2023年10月1日にLINEヤフー株式会社になりました。LINEヤフー株式会社の新しいブログはこちらです。LINEヤフー Tech Blog こんにちは、検索事業部の角田です。 私が担当しているプロジェクトではPHPUnitとSeleniumを使ってテストを行っています。そして、最近YUI TestというJavaScriptによるユニットテストライブラリを使い始め、JavaScriptのユニットテストがとてもいい感じに思えてきたのでご紹介します。 YUI Testは、Yahoo! Developer Networkにて公開されているYahoo! UI Libraryの数多くあるコンポーネントの中の一つです。その名の通り、JavaScriptのユニットテストを行うライブラリです。JavaによるJUnitやPHPによるPHPUnitを使ったことのある方であれば、すぐに使い方
yodelerというYahoo UI ライブラリベースのUIを開発しているReid Burkeさんが発表したのが、タブ切り替えとスクロールを組み合わせた新しいタブ切り替え表示部品。 切り替えるときにタブの中身の切り替わりがスクロールでなされる、ということなんだけど、見てもらうほうがはやい。 縦スクロール版 / 横スクロール版 切り替えに時間がかかるので日常使いのページには良くない気もするけど、そうでないときにちょっとユーザをびっくりさせることができるかもしれない。 ライブラリはBSDライセンスで、その他の作品とあわせてsvnで公開されている。 via Ajaxian この記事は移転前の古いURLで公開された時のものですブックマークが新旧で分散している場合があります。移転前は現在とは文体が違い「である」調です。(参考)記事の内容が古くて役に立たなくなっている、という場合にはコメントやツイッタ
inputExは、クライアント側だけでバリデーションや入力補助つきのフォームを作成できるJavascriptライブラリだ。MITライセンスで、Yahoo UI libraryのバージョン2.5.1をベースにしている。 サンプルのページからデモを開くとわかるけれど、 JSON形式の短い記述のみで、きちんとしたフォームが使える。一般的なフォーム、URLやメールアドレス、IPアドレスなど特定のフォーマットに従ったフォーム、グループの制約を持つフォームやカラーピッカー、WISYWIGエディタまで、様々なフォームのための部品が提供されている。 ドキュメントもきちんとしているし、GUIでこのJSONデータを作成するためのフォームビルダも提供されているので、使うための敷居は低いだろう。 サーバ側でフォームを書かないため、このライブラリで作ったフォームは、Javascriptがオフになっていると動かなくな
22日(現地時間)、James Coglan氏は自身のブログ「The If Works」上でJavaScriptライブラリ「Ojay」がオープンソースとして公開されたことを発表した。 Ojayは、同氏が働いている「the OTHER media」で開発されていたJavaScriptライブラリ。今までは社内で開発されてきたが、今回オープンソースとして公開されることとなった。 Ojayは米Yahoo!が開発を行っているリッチクライアントWebアプリケーション開発向けのJavaScriptライブラリ「YUI」(The Yahoo! User Interface Library)のラッパーだ。YUIが抱えているいくつかの問題を解決し、オブジェクト指向のスタイルで読みやすいコードを簡単に記述できるようになる。現在、DOM、アニメーション、イベント、Ajaxモジュールのラッパーが提供されている。 同氏
YUI2.5.0の新機能、Flickr風の複数ファイルアップローダをPHPで実装してみる 2008年02月25日- YUI 2.5.0 Released ? Big upgrades to DataTable, new Layout Manager, Flickr-style multi-file Uploader, and more Yahoo! User Interface Blog The YUI Team just released version 2.5.0 of the library. We’ve added six new components ? Layout Manager, Uploader (multi-file upload engine combining Flash and JavaScript), Resize Utility, ImageCropper,
YUI Blog Development YUI 2.5.0 Released — Big upgrades to DataTable, new Layout Manager, Flickr-style multi-file Uploader, and more YUI 2.5.0 Released — Big upgrades to DataTable, new Layout Manager, Flickr-style multi-file Uploader, and more The YUI Team just released version 2.5.0 of the library. We've added six new components — Layout Manager, Uploader (multi-file upload engine combining Flash
今回はYahoo UI LibraryのUIの1つであるLogger(ログ表示)機能について説明します。このLoggerはユーザーに対して利用するものではなく開発者がデバッグ時に利用するものです。デバッグ時に変数の値や呼び出した関数などを表示したい時に使います。つまり開発時の補助機能です。 関連ファイルの入手 まず、Yahoo UI Libraryを入手しましょう(*1)。Yahoo UI LibraryのダウンロードはこのURLにある「Download YUI」のボタンをクリックします。 Yahoo! UI Libraryの入手 ダウンロードしたファイルはZIP形式になっているので解凍します。解凍するとbuild, docs, examplesフォルダとREADMEファイルがあります。Loggerで必要になるファイルは下図に示すハイライトされたファイルです。 解凍図 これらのファイルを適
今回はYahoo! UI LibraryのUIの1つであるタブ機能について説明します。このタブ機能はHTMLタグに特定のクラスを設定しスクリプトを1行呼び出すだけでUIを作成できます。タブを使って、Webサイトの表示内容を複数に区分したい場合などには最適なライブラリとなるでしょう。 Yahoo! UI Libraryの入手 まず、Yahoo! UI Libraryを入手しましょう(*1)。Yahoo! UI Libraryのダウンロードは以下のURLにある「Download YUI」のボタンをクリックします。 Yahoo! UI Libraryの入手 ダウンロードしたファイルはZIP形式になっているので解凍します。解凍するとbuild, docs, examplesフォルダとREADMEファイルがあります。今回必要になるファイルは下図に示すハイライトされたファイルです。 解凍図 これらのフ
YUI Blog Development YUI 2.4.0 Released — Selector, Charts, Profiler, Script/CSS Get, and JSON Support YUI 2.4.0 Released — Selector, Charts, Profiler, Script/CSS Get, and JSON Support We released YUI version 2.4.0 today; it's available for download and full documentation is up on the YUI website. Here are the all-new components being issued with 2.4.0: Selector Utility: Matt Sweeney introduces th
The Yahoo! User Interface Library (YUI)【e】 今更ながらJavaScriptに興味を持ちまして、独学中であります。してYahooUIも参考にすることがあるのですが、やはり英語なので敷居が若干高いですよね。 というわけで、日本語でリファレンスを作ってくださっている方、応用例を紹介している方などのサイトをまとめておきました。 古旗さんの詳細な総合リファレンス Yahoo UI Library リファレンス【e】 古旗一浩さんがYahooUIの詳細なリファレンスを作成なさっています。サンプルコードも付いていて嬉しいですね。 hibomaさんによるYahoo! UI Librady の訳 まとめ hibomaのはてなダイアリー – Yahoo! UI Librady の訳 まとめ【e】 翻訳してくれるというのはとても助かります。とくに「hibomaのはてなダ
2007年8月10日に開催したCSS Nite Vol.20の第2部、エリック・ミラリアさんとジェニー・ドネリーさん(YUIチーム)の『The YUI Library: JavaScript and CSS Foundations for the Rich Internet Evolution』の資料と音声を共有します。 オンスクリーンプレゼン資料 音声(MP3、3.6MB、1:07'49") そのほか、YUIについては下記のサイトなどをご参照ください。 Cheat Sheets for the YUI Utilities The Yahoo! User Interface Library (YUI) Yahoo! User Interface Blog youmos | Yahoo! UI Library のYUI ライブラリサンプル (Yahoo! UI Library) Ajax Y
YUI Blog Development YUI 2.3.0: Six New Components and a Prettier Face YUI 2.3.0: Six New Components and a Prettier Face We're pleased to announce today the release of YUI version 2.3.0. This release features six new additions to the library as well as a new skinning architecture and a new visual treatment for most of our UI controls. All of this, plus 250 enhancements and bug fixes, is available
とりあえず資料を公開します。 資料 JavaScript ONでご覧ください。 最初のリンクをクリックするとプレゼンモードで閲覧できます。 プレゼンモードは若干大きい画面が必要になります。 基本喋りがメインなので資料だけではわかりづらい&抜けがあるかと思いますが、ご了承ください。 まぁYUIを使うメリットって クロスブラウザ対応がメインだよね。 あとYUIって結構パフォーマンスいいよ。 みんなもっとYUI使えばいいのに!! というわけで 参加されたみなさん(っていうか現在進行中だけど)お疲れ様でした>< 勉強会全体のまとめはUKStudioがきっと書いてくれると思います>< 最後に 会議室を貸してくださった上鍵さんをはじめとしたノッキングオンの皆様ありがとうございました! 会議室を利用したいかたは「ノッキングオンの会議室使いたい!」までこんにちは!こんにちはしましょう!
Yahoo! UI Library のリファレンスを見てもキーボードイベントを取り扱う方法がいまいち分かりにくかったので、以下に簡単なサンプルを掲載しておきます。少々理解できていない部分があるので必要最小限の情報です。 必要なライブラリ イベントを扱うだけであれば、yahoo-min.jsとevent-min.jsをインクルードしておけばいいです。ライブラリはYahoo!がホスティングしてくれます。 <script type="text/javascript" src="http://yui.yahooapis.com/2.2.2/build/yahoo/yahoo-min.js" ></script> <script type="text/javascript" src="http://yui.yahooapis.com/2.2.2/build/event/event-min.js" >
Cruft [kruft] The results of shoddy construction Superfluous junk Cruft is to hackers as gaggle is to geese Anything unpleasant that accumulates over time What's this? DED|Chain is free open source software (BSD License) that will allow you to build first class, high-quality websites without the cruft. You get the reliability of Yahoo! UI, and the developer friendliess of jQuery. You also receiv
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く