Yahoo! User Interface Library（以下YUI）は、米Yahoo!が開発しているJavaScriptライブラリである。オープンソースのBSDライセンスに基づいてリリースされており、無償でAjaxアプリケーションの構築に利用することができる。この特集では、7月末にリリースされた最新バージョン2.3.0に追加されたコンポーネントと、YUIの基本について解説していく。

　2007年7月31日、Yahoo!からYUI2.3.0がリリースされた（リリースを伝える開発者ブログのエントリ）。このバージョンでは、新たに6つのコンポーネントが追加された。初回はこれらのコンポーネントの概要を述べて、次回以降でそれらについて具体的な解説を加えていきたい。

　なお、リリースされたコンポーネントのほとんどはベータ版（beta）もしくは実験的な（experimental）リリースなので、対応するブラウザや利用条件に配慮した上でご利用いただきたい。

Color Picker Control - beta

　画面上の表示色を選択するコンポーネントで、Webブラウザ上のGUIで色を選択すると、その色を表示するためのFFFFFFなど16進数6桁の値を得られる。機能はシンプルだが、画面のカスタマイズ機能を充実されたアプリケーションの構築には欠かせないコンポーネントとなるだろう。

Rich Text Editor - beta

　フォントの種類や大きさなど書式を変更できるテキストエディタである。HTMLフォームのを拡張する方法で、ワープロソフトでお馴染みの書式設定ボタンが表示される。</p> <p>　IEの一部のバージョンではテキストを選択できないなどのバグが確認されているが、このコンポーネントの<a href="http://developer.yahoo.com/yui/editor/" target="_blank">ドキュメント</a>の「Known Issues in RTE 2.3.0」に掲載されているCSSを追加設定すると解決できるという。該当するバージョンを用いているユーザーは注意していただきたい。</p> <h4><a href="http://developer.yahoo.com/yui/yuiloader/" target="_blank">YUILoader Utility</a> - beta</h4> <p>　YUIの個別のライブラリを、文字列の名称で指定してロードできるようにするユーティリティである。別のJavaScriptライブラリであっても、モジュールとして名称を指定しておけば、同様にロードが可能となる。</p> <p>　登録済みの名称は、たとえば、前述のRich Text Editorは"editor"、<a href="http://developer.yahoo.com/yui/calendar/" target="_blank">Calendar Control</a>は"calendar"という具合である。詳細は<a href="http://developer.yahoo.com/yui/yuiloader/" target="_blank">ドキュメント</a>の「YUI Module Names」を参照していただきたい。</p> <h4><a href="http://developer.yahoo.com/yui/imageloader/" target="_blank">ImageLoader Utility</a> - experimental</h4> <p>　画像が用いられたWebページをロードする際、画像のみを後からロードできるようにするユーティリティだ。画像が用いられたWebページは、Webブラウザの種類にもよるものの、画像のロードが完了するまでページ全体が表示されないことがある。このユーティリティはそうした事態を改善するねらいで開発された。</p> <h4><a href="http://developer.yahoo.com/yui/yuitest/" target="_blank">YUI Test Utility</a> - beta</h4> <p>　JavaScriptアプリケーションのユニットテストを行うためのクラス群で、TestSuite、TestRunner、Assertなど、さながらJUnitのそれと良く似た機能や名称を持つクラスが定義されている。また、ユーザーのWebブラウザ上での操作をシミュレートするクラスも定義されている。</p> <h4><a href="http://developer.yahoo.com/yui/base/" target="_blank">Base CSS</a></h4> <p>　YUIのCSSライブラリが、基盤部分の設定を行う<a href="http://developer.yahoo.com/yui/base/" target="_blank">CSS Base</a>、フォントの種類や大きさを決める<a href="http://developer.yahoo.com/yui/fonts/" target="_blank">CSS Fonts</a>、Webブラウザの画面を複数の領域に分割してコンテンツを表示させる<a href="http://developer.yahoo.com/yui/grids/" target="_blank">CSS Grids</a>、そして設定をリセットする<a href="http://developer.yahoo.com/yui/reset/" target="_blank">Reset CSS</a>にまとめられた。</p> <p>　CSS Gridsで指定可能なレイアウトのうち、33%-33%-33%というレイアウトにおいて大きなスワップが発生することが確認されており、メーリングリストでそれに対処するための<a href="http://tech.groups.yahoo.com/group/ydn-javascript/message/16079" target="_blank">パッチが公開されている</a>。利用を考えているユーザーは確認していただきたい。</p> <h3>YUIのダウンロードとWebブラウザの設定</h3> <p>　YUIはJavaScriptライブラリなので、実行環境となるWebブラウザにおいてJavaScriptを実行できるように設定しておかなくてはならない。職場などの利用環境ではセキュリティに配慮してJavaScriptの実行を許可していない場合もあるので、設定が可能かどうかをあらかじめ確認しておいていただきたい。また、YUIが対応しているWebブラウザは<a href="http://developer.yahoo.com/yui/articles/gbs/index.html" target="_blank">Graded Browser Support</a>に掲載されているので、こちらも合わせて確認しよう。</p> <p>　YUIが利用可能であれば、<a href="http://developer.yahoo.com/yui/download/" target="_blank">YUIの本体をダウンロードサイトへのリンク</a>からダウンロードしよう。これをクリックすると<a href="http://sourceforge.net/projects/yui/" target="_blank">SourceForge.net</a>にリダイレクトされ、自動的にZIP形式のファイルがダウンロードされる(容量は約12MB)。もしダウンロードが開始されない場合は、「this direct link」というリンクをクリックしてほしい。</p> <p>　ダウンロードが完了したら、ZIPファイルを展開しよう(容量は約40MB)。このとき、ドライブの空き容量が十分に確保されていることを事前に確認しておいていただきたい。</p> <p>　これでYUIの実行環境が整った。次回から、YUI2.3.0で追加されたコンポーネントについて解説を加えていきたい。JavaScriptライブラリによるAjaxアプリケーションの世界を探検していこう。</p><!--// article_end //--> </div> </div> <!-- ad_text --> <ul class="ad_text ad_bottom_text"> <script type="text/javascript">var impApid = null;</script><script type="text/javascript" language="JavaScript"> <!-- impArnd = Math.round(Math.random() * 100000000); if (!impApid) var impApid = Math.round(Math.random() * 100000000); var protocol = 'http'; var adServer = 'imp.aiasahi.jp'; var uri = new Array(); uri.push('jserver'); uri.push('acc_random=' + impArnd); uri.push('SITE=ZDNET.ETC/AREA=UNDERTEXT1/AAMSZ=520X70/KEYWORD=development%2Czone_development_sp_07yui%2C20014313%2C20356439/OENCJP=UTF8'); uri.push('pageid=' + impApid); var url = protocol + '://' + adServer; for(var i=0; i< uri.length; i++){ url += '/' + uri[i]; } document.write('<scr'); document.write('ipt type="text/javascript" language="JavaScript" src="' + url + '">'); document.write('</scr'); document.write('ipt>'); //--> </script> <noscript> <iframe src="http://imp.aiasahi.jp/hserver/SITE=ZDNET.ETC/AREA=UNDERTEXT1/AAMSZ=520X70/KEYWORD=development%2Czone_development_sp_07yui%2C20014313%2C20356439/OENCJP=UTF8/" noresize scrolling="no" hspace="0" vspace="0" frameborder="0" marginheight="0" marginwidth="0" width="520" height="70" allowTransparency="true"> </iframe> </noscript><script type="text/javascript">var impApid = null;</script><script type="text/javascript" language="JavaScript"> <!-- impArnd = Math.round(Math.random() * 100000000); if (!impApid) var impApid = Math.round(Math.random() * 100000000); var protocol = 'http'; var adServer = 'imp.aiasahi.jp'; var uri = new Array(); uri.push('jserver'); uri.push('acc_random=' + impArnd); uri.push('SITE=ZDNET.ETC/AREA=UNDERTEXT2/AAMSZ=520X70/KEYWORD=development%2Czone_development_sp_07yui%2C20014313%2C20356439/OENCJP=UTF8'); uri.push('pageid=' + impApid); var url = protocol + '://' + adServer; for(var i=0; i< uri.length; i++){ url += '/' + uri[i]; } document.write('<scr'); document.write('ipt type="text/javascript" language="JavaScript" src="' + url + '">'); document.write('</scr'); document.write('ipt>'); //--> </script> <noscript> <iframe src="http://imp.aiasahi.jp/hserver/SITE=ZDNET.ETC/AREA=UNDERTEXT2/AAMSZ=520X70/KEYWORD=development%2Czone_development_sp_07yui%2C20014313%2C20356439/OENCJP=UTF8/" noresize scrolling="no" hspace="0" vspace="0" frameborder="0" marginheight="0" marginwidth="0" width="520" height="70" allowTransparency="true"> </iframe> </noscript><script type="text/javascript">var impApid = null;</script><script type="text/javascript" language="JavaScript"> <!-- impArnd = Math.round(Math.random() * 100000000); if (!impApid) var impApid = Math.round(Math.random() * 100000000); var protocol = 'http'; var adServer = 'imp.aiasahi.jp'; var uri = new Array(); uri.push('jserver'); uri.push('acc_random=' + impArnd); uri.push('SITE=ZDNET.ETC/AREA=UNDERTEXT3/AAMSZ=520X70/KEYWORD=development%2Czone_development_sp_07yui%2C20014313%2C20356439/OENCJP=UTF8'); uri.push('pageid=' + impApid); var url = protocol + '://' + adServer; for(var i=0; i< uri.length; i++){ url += '/' + uri[i]; } document.write('<scr'); document.write('ipt type="text/javascript" language="JavaScript" src="' + url + '">'); document.write('</scr'); document.write('ipt>'); //--> </script> <noscript> <iframe src="http://imp.aiasahi.jp/hserver/SITE=ZDNET.ETC/AREA=UNDERTEXT3/AAMSZ=520X70/KEYWORD=development%2Czone_development_sp_07yui%2C20014313%2C20356439/OENCJP=UTF8/" noresize scrolling="no" hspace="0" vspace="0" frameborder="0" marginheight="0" marginwidth="0" width="520" height="70" allowTransparency="true"> </iframe> </noscript></ul> <!-- //ad_text --><!-- reference --> <dl class="reference_kw"> <dt class="kw_content">関連キーワード</dt> <dd> <a href="/paper/development/">開発</a> </dd> </dl> <!-- //reference --><h2 class="t_grayline"><b>この記事を読んだ人におすすめの資料</b></h2> <div class="recommend"> <div class="reccomend_list clearfix"> <!-- <span class="reccomend_nav prev">≪</span> <span class="reccomend_nav next">≫</span> --> <ul class="list_box clearfix"> <li> <a href="/paper/20172688/30000290/?tag=zd_sleaf_recom"> <span><img src="/storage/2012/04/11/fba3f65466588db8efe16f15c606cb7a/pdf_thumb.jpg"></span> <h3>企業レベルでのアジャイル開発を意識した、ハイブリッド型開発フレームワーク</h3> </a> </li> <li> <a href="/paper/20172688/30000288/?tag=zd_sleaf_recom"> <span><img src="/storage/2012/04/11/6c95f55f797db66b22e5777b0db43b01/pdf_thumb.jpg"></span> <h3>ソフトウェア品質がビジネスの成否を左右する--いま取り組むべき6つの戦略とは</h3> </a> </li> <li> <a href="/paper/20172688/30000289/?tag=zd_sleaf_recom"> <span><img src="/storage/2012/04/11/24c0f5949ec6c0034cf47f7da211e7c3/pdf_thumb.jpg"></span> <h3>ハンドブック-単なる成果物管理ではないCLMが可能にする、生産性や競争力に優れた製品・サービス開発</h3> </a> </li> <li> <a href="/paper/30000219/30000245/?tag=zd_sleaf_recom"> <span><img src="/storage/2012/02/23/512ed99e1050dee9b671c676e5cf3104/pdf_thumb.jpg"></span> <h3>企業システムにおけるノンプログラム開発の将来性</h3> </a> </li> </ul> </div> </div><!-- 関連記事 --> <h2 class="t_grayline"><b>関連記事</b></h2> <ul class="arrow_list1"> <li> <h3><a href="http://japan.zdnet.com/development/sp_07spry/20356389/">Adobe SpryとDreamweaver CS3であのエフェクトもサクサク：魅力のAjaxライブラリAdobe Spry入門</a></h3> </li> <li> <h3><a href="http://japan.zdnet.com/development/sp_07spry/20355823/">あのエフェクトがこんなに簡単に：魅力のAjaxライブラリAdobe Spry入門</a></h3> </li> <li> <h3><a href="http://japan.zdnet.com/development/sp_07spry/20355291/">まずは体感：魅力のAjaxライブラリAdobe Spry入門</a></h3> </li> <li> <h3><a href="http://japan.zdnet.com/development/analysis/20356432/">jQuery 1.2リリース--多くの新機能が追加</a></h3> </li> <li> <h3><a href="http://japan.zdnet.com/development/analysis/20352062/">jquery 1.1.3：8倍以上高速に、サイズは20KB保つ</a></h3> </li> </ul> <!-- //関連記事 --><!-- バックナンバー --> <h2 class="t_grayline"><b><a href="/development/sp_07yui/">「特集 ： 強力AjaxライブラリYahoo! UI Library」</a> バックナンバー</b></h2> <ul class="arrow_list1"> <li> <h3><a href="/development/sp_07yui/20356439/">YUI 2.3.0 の追加コンポーネント概要：強力AjaxライブラリYahoo! UI Library</a></h3> </li> <li> <h3><a href="/development/sp_07yui/20356442/">Color Picker Control：強力AjaxライブラリYahoo! UI Library</a></h3> </li> <li> <h3><a href="/development/sp_07yui/20356883/">書式設定可能なエディタも簡単に：強力AjaxライブラリYahoo! UI Library</a></h3> </li> </ul> <!-- //バックナンバー --><div class="tieup_box clearfix"> <h2>ピックアップコンテンツ<span>PR</span></h2> <ul class="tieup"> <li class="clearfix"> <h3><a href="http://japan.zdnet.com/click/fujitsu_110516_01.htm"><img src="http://japan.cnet.com/ads/2011/80X60/fujitsu_110516_60x80.jpg" width="80" height="60">勝ち残るIT活用--中堅中小企業の現場から</a></h3> <p>タレントの江口ともみさんをレポーターに、<br>全国さまざまな業種の企業担当者に聞く！</p> </li> <li class="clearfix"> <h3><a href="http://japan.zdnet.com/click/zdcyber_120213_01.htm"><img src="http://www.aiasahi.jp/ads/2012/80X60/120213_cyberattack_banner_80_60.jpg" width="80" height="60">サイバー攻撃関連ニュースのまとめ</a></h3> <p>特別企画：高度化するサイバー攻撃からビジネスを守る<br>～対策レポートや企業の製品動向をまとめ読み～</p> </li> </ul> </div><!-- tieup_detail --> <div class="tieup_list_box clearfix"> <h2>企画特集<span>PR</span></h2> <div class="tieup_list"> <h3><span>事列解説</span></h3> <ul> <li class="arrow"><a href="http://japan.zdnet.com/click/hitachi_120322_01.htm">熟練者のノウハウや業務手順もマニュアル化</a></li> <li class="arrow"><a href="http://japan.zdnet.com/click/dell_110526_04.htm">国内企業のPCライフサイクル管理の実態</a></li> <li class="arrow"><a href="http://japan.zdnet.com/click/ca_110525_02.htm">必ず発生する災害と、どう向き合うか</a></li> <li class="arrow"><a href="http://japan.cnet.com/click/career_110125_01.htm">IT業界の転職成功事例、失敗事例</a></li> </ul> </div> <div class="tieup_list"> <h3><span>ソリューション</span></h3> <ul> <li class="arrow"><a href="http://japan.zdnet.com/click/iij_120330_02.htm">ウェブの私的利用と公的利用の境目はどこに？</a></li> <li class="arrow"><a href="http://japan.zdnet.com/click/iij_120319_02.htm">サイバー攻撃の実態と対策TIPS--IIJ講演</a></li> <li class="arrow"><a href="http://japan.zdnet.com/click/nttcom_120111_02.htm">グローバル時代を支えるネットワーク</a></li> <li class="arrow"><a href="http://japan.zdnet.com/click/ibm_110912_02.htm">クラウド導入の“本当の秘訣”を知る</a></li> </ul> </div> <div class="tieup_list"> <h3><span>インタビュー</span></h3> <ul> <li class="arrow"><a href="http://japan.zdnet.com/click/nec_110913_02.htm">弁護士の視点で見る、データ保護の重要性</a></li> <li class="arrow"><a href="http://japan.zdnet.com/click/quality_110708_01.htm">「想定外」に立ち向かうために今すべきこと</a></li> <li class="arrow"><a href="http://japan.zdnet.com/click/quality_110525_02.htm">リスク管理のプロが贈るBCP策定アドバイス</a></li> <li class="arrow"><a href="http://japan.zdnet.com/click/nec_110304_04.htm">自らクラウドで事業価値創出を実証するNEC</a></li> </ul> </div> <div class="tieup_list"> <h3><span>デジタル製品</span></h3> <ul> <li class="arrow"><a href="http://japan.zdnet.com/click/motorola_111122_01.htm">モトローラ日本再来の本気度を感じるスマホ</a></li> <li class="arrow"><a href="http://japan.zdnet.com/click/motorola_110708_02.htm">Android 3.1搭載 MOTOROLA XOOM をレビュー</a></li> <li class="arrow"><a href="http://japan.zdnet.com/click/kofax_110224_01.htm">紙文書の電子化で企業文化を変革</a></li> <li class="arrow"><a href="http://japan.zdnet.com/click/hitachidensa_110204_01.htm">堅牢なデータセンターにデータを保管</a></li> </ul> </div> </div> <!-- //tieup_detail --> </div> <!-- //content_l --> <!-- content_r --> <div class="content_r"> <!-- ad_bnr --> <div class="ad_bnr"> <script type="text/javascript">var impApid = null;</script><script type="text/javascript" language="JavaScript"> <!-- impArnd = Math.round(Math.random() * 100000000); if (!impApid) var impApid = Math.round(Math.random() * 100000000); var protocol = 'http'; var adServer = 'imp.aiasahi.jp'; var uri = new Array(); uri.push('jserver'); uri.push('acc_random=' + impArnd); uri.push('SITE=ZDNET.ETC/AREA=RECT/AAMSZ=300X500/KEYWORD=development%2Czone_development_sp_07yui%2C20014313%2C20356439/OENCJP=UTF8'); uri.push('pageid=' + impApid); var url = protocol + '://' + adServer; for(var i=0; i< uri.length; i++){ url += '/' + uri[i]; } document.write('<scr'); document.write('ipt type="text/javascript" language="JavaScript" src="' + url + '">'); document.write('</scr'); document.write('ipt>'); //--> </script> <noscript> <iframe src="http://imp.aiasahi.jp/hserver/SITE=ZDNET.ETC/AREA=RECT/AAMSZ=300X500/KEYWORD=development%2Czone_development_sp_07yui%2C20014313%2C20356439/OENCJP=UTF8/" noresize scrolling="no" hspace="0" vspace="0" frameborder="0" marginheight="0" marginwidth="0" width="300" height="500" allowTransparency="true"> </iframe> </noscript></div> <!-- //ad_bnr --><!-- sales banner start --> <div class="tieup_sp"> <p> <a href="http://japan.zdnet.com/click/zdnetcamp_120412_01.htm"> <img src="http://www.aiasahi.jp/ads/2012/120412_zd_camp_300_70.jpg" alt=""> </a> </p> </div> <!-- //sales banner start --> <!-- tieup --> <div class="headline">ZDNet Japanスペシャル<span>PR</span></div> <ul class="tieup clearfix"> <li class="clearfix"> <strong> <a href="http://japan.zdnet.com/click/trendmicro_120417_04.htm"> <img src="http://www.aiasahi.jp/ads/2012/40X30/120417_trendmicro_40-30.jpg" width="40" height="30"> 物理→VDI環境移行「3つの罠」とは </a> </strong> <p>陥らないためのワンポイント解説＆<br>”実証実験から読み解くセミナー”情報</p> </li> <li class="clearfix"> <strong> <a href="http://japan.zdnet.com/click/trendmicro_120427_01.htm"> <img src="http://www.aiasahi.jp/ads/2012/40X30/120427_trendmicro_40_30.jpg" width="40" height="30"> スマートデバイスに忍び寄る危機！ </a> </strong> <p>福田和代が贈るZDNetオリジナルストーリー<br>見逃せない3部作の第1回が無料公開！</p> </li> <li class="clearfix"> <strong> <a href="http://japan.zdnet.com/click/verisign_120423_01.htm"> <img src="http://www.aiasahi.jp/ads/2012/40X30/120423_verisign_40-30.jpg" width="40" height="30"> セキュリティでブランド価値を向上 </a> </strong> <p>ウェブ消費行動の専門家×日本ベリサイン<br>ネットで消費者の信頼を得るポイントとは</p> </li> <li class="clearfix"> <strong> <a href="http://japan.zdnet.com/click/hitachi_120517_05.htm"> <img src="http://www.aiasahi.jp/ads/2012/40X30/120517_hitachi_a_40_30.jpg" width="40" height="30"> 日立の新サーバに見る、日立の本気 </a> </strong> <p>日立のサーバ戦略が描く、IT活用の今後<br>仮想化・クラウド対応としての製品強化</p> </li> <li class="clearfix"> <strong> <a href="http://japan.zdnet.com/click/hp_120130_02.htm"> <img src="http://www.aiasahi.jp/ads/2012/40X30/120329_hp_40_30.gif" width="40" height="30"> データ爆発に備える"無限の可能性" </a> </strong> <p>必要以上の容量を奨められていませんか？<br>→電気ガスのように使えるストレージを知る</p> </li> <li class="clearfix"> <strong> <a href="http://japan.zdnet.com/click/nifty_120417_01.htm"> <img src="http://www.aiasahi.jp/ads/2012/40X30/120417_nifty_40-30.gif" width="40" height="30"> クラウド意識調査結果を公開 </a> </strong> <p>率直な読者のご意見を全て公開<br>クラウドに対する疑問や実際の効果に迫る</p> </li> <li class="clearfix"> <strong> <a href="http://japan.zdnet.com/click/oracle_120521_01.htm"> <img src="http://www.aiasahi.jp/ads/2012/40X30/120521_oracle_40-30.gif" width="40" height="30"> 企業情報セキュリティもオラクル！ </a> </strong> <p>境界防御だけでは、もはや不十分？<br>大切なデータベースを守る方法とは</p> </li> <li class="clearfix"> <strong> <a href="http://japan.zdnet.com/click/hitachi_120426_01.htm"> <img src="http://www.aiasahi.jp/ads/2012/40X30/120426_hitachi_40_30.gif" width="40" height="30"> 百聞は一見で！日立のビッグデータ </a> </strong> <p>JP1、Hadoop、QlickView　"集計・分析"<br>データをクラウドに集約　”蓄積・検索"</p> </li> <li class="arrow"> <strong> <a href="http://japan.zdnet.com/click/trendmicro_120323_01.htm">脆弱性に緊急対応する仮想パッチ</a> </strong> <p>物理パッチ適用までにサーバを襲う脅威から<br>自動的に保護するDeep Securityエージェント</p> </li> <li class="arrow"> <strong> <a href="http://japan.zdnet.com/click/trendmicro_120423_01.htm">情報交換会参加しませんか？</a> </strong> <p>製造業者必見<br>オフライン環境のセキュリティ対策</p> </li> </ul> <!-- //tieup --> <!-- more --> <p class="more"><a href="/extra/">企画特集一覧へ</a></p> <!-- //more --> <div id="right_newsletter_box" class="box_gray"> <h2>ZDNetニューズレターを購読する</h2> <div class="btn_newsletter"> <a href="/guide/cnet_id/">購読のお申し込みはこちら</a></div> </div><!-- ranking --> <div class="headline t_grayline"><b>カテゴリーランキング</b></div> <div class="ranking"> <ol> <li class="num01"><a href="/development/sp/35012998/">2012年、目が離せない技術--注目すべき3つの話題 - ZDNet Japan</a></li> <li class="num02"><a href="/development/analysis/35000988/">OpenOfficeにも縛られない--会津若松市がLibreOfficeの試用を開始 - ZDNet Japan</a></li> <li class="num03"><a href="/development/analysis/35017266/">大規模プロジェクトの管理データ標準化で協議会設立--RESTfulを基盤に - ZDNet Japan</a></li> <li class="num04"><a href="/development/sp_hikinougrade11/35011544/">非機能要求とは何か - ZDNet Japan</a></li> <li class="num05"><a href="/development/case-study/35016973/">アスクル、コールセンターをアジャイル型の手法で刷新--期間は3分の1、コストは5分の1に - ZDNet Japan</a></li> </ol> </div> <!-- //ranking --> <!-- facebook --> <div class="facebook"> <script type="text/javascript"> var valid_browser = true; if (/MSIE (\d+\.\d+);/.test(navigator.userAgent)){ var ieversion = new Number(RegExp.$1) if(ieversion < 7) valid_browser = false; } if(valid_browser){ document.write('<scr'); document.write('ipt src="http://connect.facebook.net/ja_JP/all.js#xfbml=1">'); document.write('</scr'); document.write('ipt>'); document.write('<fb:recommendations site="http://japan.zdnet.com" width="300" height="300" header="true"></fb:recommendations>'); } </script> </div> <!-- //facebook --><!-- tieup --> <div class="headline">スペシャル<span>PR</span></div> <ul class="tieup clearfix"> <li class="clearfix"> <strong> <a href="http://japan.zdnet.com/click/hp_120315_01.htm"> <img src="http://www.aiasahi.jp/ads/2012/40X30/120315_hp_40_30.jpg" width="40" height="30"> クラウド神話をリアルで読み解く </a> </strong> <p>最新テクノロジ満載、「百度」の講演も！<br>TECHNOLOGY @WORK 東京 2012レポート</p> </li> </ul> <!-- //tieup --><!-- company_info --> <div class="headline t_grayline"><b>新着企業動向</b></div> <ul class="company_info"> <li class="clearfix"> <span class="release_info"><a href="/release/" title="リリース">リリース</a></span> <strong><a href="http://japan.zdnet.com/release/30020170/">NCsoftファン待望の大新作『Blade&Soul-ブレイドアンドソウル』韓国にてオープンベータテストを2012年6月21日に実施 </a></strong> <p class="company">エヌ・シー・ジャパン株式会社</p> </li> <li class="clearfix"> <span class="event_info"><a href="/event_info/" title="イベント">イベント</a></span> <strong><a href="http://japan.zdnet.com/event_info/30001970/">無料セミナー「失敗しないサーバ仮想化へ、 事業継続からパフォーマンス管理まで」</a></strong> <p class="company">株式会社クライム</p> </li> <li class="clearfix"> <span class="blog_info"><a href="/topic/" title="企業ブログ">企業ブログ</a></span> <strong><a href="/company/topic/30000267/">PMC-Sierra がMaximからサーバストレージ12Gb/秒エクスパンダプロダクトラインを買収</a></strong> <p class="company">ピーエムシー・シエラ・ジャパン株式会社</p> </li> </ul> <!-- //company_info --> <!-- more --> <p class="more"><a href="/company/">企業動向一覧へ</a></p> <!-- //more --> <!-- ad_bnr --> <div class="ad_bnr"> <script type="text/javascript">var impApid = null;</script><script type="text/javascript" language="JavaScript"> <!-- impArnd = Math.round(Math.random() * 100000000); if (!impApid) var impApid = Math.round(Math.random() * 100000000); var protocol = 'http'; var adServer = 'imp.aiasahi.jp'; var uri = new Array(); uri.push('jserver'); uri.push('acc_random=' + impArnd); uri.push('SITE=ZDNET.ETC/AREA=VRECT/AAMSZ=300X500/KEYWORD=development%2Czone_development_sp_07yui%2C20014313%2C20356439/OENCJP=UTF8'); uri.push('pageid=' + impApid); var url = protocol + '://' + adServer; for(var i=0; i< uri.length; i++){ url += '/' + uri[i]; } document.write('<scr'); document.write('ipt type="text/javascript" language="JavaScript" src="' + url + '">'); document.write('</scr'); document.write('ipt>'); //--> </script> <noscript> <iframe src="http://imp.aiasahi.jp/hserver/SITE=ZDNET.ETC/AREA=VRECT/AAMSZ=300X500/KEYWORD=development%2Czone_development_sp_07yui%2C20014313%2C20356439/OENCJP=UTF8/" noresize scrolling="no" hspace="0" vspace="0" frameborder="0" marginheight="0" marginwidth="0" width="300" height="500" allowTransparency="true"> </iframe> </noscript></div> <!-- //ad_bnr --><!-- site_info --> <div class="site_info"> <p>ZDNet Japanは、CIOとITマネージャーを対象に、ビジネス課題の解決とITを活用した新たな価値創造を支援します。</p> <p>ITビジネス全般については、<strong><a href="http://japan.cnet.com/" target="_blank">CNET Japan</a></strong>をご覧ください。</p> </div> <!-- //site_info --></div> <!-- //content_r --> </div> <!-- //wrapper --> <!-- footer --> <div id="footer"> <!--AD_LARGE_FOOTER--> <div id="ad_footerlarge" class="clearfix"> <script type="text/javascript">var impApid = null;</script><script type="text/javascript" language="JavaScript"> <!-- impArnd = Math.round(Math.random() * 100000000); if (!impApid) var impApid = Math.round(Math.random() * 100000000); var protocol = 'http'; var adServer = 'imp.aiasahi.jp'; var uri = new Array(); uri.push('jserver'); uri.push('acc_random=' + impArnd); uri.push('SITE=ZDNET.ETC/AREA=FLARGE/AAMSZ=728X90/KEYWORD=development%2Czone_development_sp_07yui%2C20014313%2C20356439/OENCJP=UTF8'); uri.push('pageid=' + impApid); var url = protocol + '://' + adServer; for(var i=0; i< uri.length; i++){ url += '/' + uri[i]; } document.write('<scr'); document.write('ipt type="text/javascript" language="JavaScript" src="' + url + '">'); document.write('</scr'); document.write('ipt>'); //--> </script> <noscript> <iframe src="http://imp.aiasahi.jp/hserver/SITE=ZDNET.ETC/AREA=FLARGE/AAMSZ=728X90/KEYWORD=development%2Czone_development_sp_07yui%2C20014313%2C20356439/OENCJP=UTF8/" noresize scrolling="no" hspace="0" vspace="0" frameborder="0" marginheight="0" marginwidth="0" width="728" height="90" allowTransparency="true"> </iframe> </noscript></div><!--/#ad_footerlarge--> <!--AD_LARGE_FOOTER END--> <!-- footer_sitelink --> <div class="footer_sitelink"> <dl class="clearfix"> <dt>ASAHI INTERACTIVE:</dt> <dd><a href="http://japan.cnet.com/" title="CNET Japan">CNET Japan</a></dd> <dd><a href="http://japan.zdnet.com/" target="_blank" title="ZDNet Japan">ZDNet Japan</a></dd> <dd><a href="http://builder.japan.zdnet.com/" target="_blank" title="builder by ZDNet Japan">builder by ZDNet Japan</a></dd> <dd><a href="http://japan.gamespot.com/" target="_blank" title="GameSpot Japan">GameSpot Japan</a></dd> <dd><a href="http://www.tetsudo.com/" target="_blank" title="Tetsudo.com">Tetsudo.com</a></dd> <dd style="border: 0px none;"><a href="http://www.re-source.jp/" target="_blank" title="Re:SOURCE">Re:SOURCE</a></dd> </dl> <dl class="clearfix"> <dt>USA Business Sites:</dt> <dd><a href="http://bnet.com/" target="_blank" title="BNET.com">BNET.com</a></dd> <dd><a href="http://www.cnet.com/" target="_blank" title="CNET.com">CNET.com</a></dd> <dd><a href="http://www.cnetchannel.com/" target="_blank" title="CNET Channel">CNET Channel</a></dd> <dd><a href="http://www.download.com/" target="_blank" title="Download.com">Download.com</a></dd> <dd><a href="http://news.com.com/" target="_blank" title="News.com">News.com</a></dd> <dd><a href="http://TechRepublic.com.com/" target="_blank" title="TechRepublic">TechRepublic</a></dd> <dd style="border: 0px none;"><a href="http://www.zdnet.com/" target="_blank" title="ZDNet.com">ZDNet.com</a></dd> </dl> <dl class="clearfix"> <dt>International Business Sites:</dt> <dd><a href="http://www.zdnet.com.au/" target="_blank" title="Australia">Australia</a></dd> <dd><a href="http://www.zdnetasia.com/" target="_blank" title="Asia">Asia</a></dd> <dd><a href="http://www.zdnet.fr/" target="_blank" title="France">France</a></dd> <dd><a href="http://www.zdnet.de/" target="_blank" title="Germany">Germany</a></dd> <dd><a href="http://www.zdnet.co.uk/" target="_blank" title="UK">UK</a></dd> <dd style="border: 0px none;"><a target="_blank" title="US" href="http://www.zdnet.com/">US</a></dd> </dl> </div> <!-- //footer_sitelink --> <!-- about_zdnet --> <div class="about_zdnet"> The Japanese edition of 'ZDNet' is published under license from CBS Interactive, Inc., San Francisco, CA, USA. Editorial items appearing in 'ZDNet Japan' that were originally published in the US Edition of 'ZDNet', 'TechRepublic', 'CNET', and 'CNET News.com' are the copyright properties of CBS Interactive, Inc. or its suppliers. Copyright (c) CBS Interactive, Inc. All Rights Reserved. 'ZDNet', 'CNET' and 'CNET News.com' are trademarks of CBS Interactive, Inc. </div> <!-- //about_zdnet --> <!-- about_ai --> <dl class="about_ai"> <dd><a href="http://aiasahi.jp/privacy.htm" target="_blank">個人情報保護方針</a></dd> <dd><a href="http://aiasahi.jp/terms.htm" target="_blank" title="利用規約 ">利用規約</a></dd> <dd><a href="http://japan.zdnet.com/correction/" title="訂正">訂正</a></dd> <dd><a href="http://aiasahi.jp/advertisement/" target="_blank">広告について</a></dd> <dd style="border: 0px none;"><a href="http://aiasahi.jp/" target="_blank" title="朝日インタラクティブについて">朝日インタラクティブについて</a></dd> </dl> <!-- //about_ai --> <p class="copyright_ai">当サイトは最新ブラウザでの閲覧を推奨します。</p> <!-- copyright_ai --> <div class="copyright_ai"> <a href="http://aiasahi.jp/rights.htm">Copyright</a> (c) 2012 ASAHI INTERACTIVE, Inc. All rights reserved. No reproduction or republication without written permission. </div> <!-- //copyright_ai --> </div> <!-- //footer --> <script type="text/javascript" src="/js/common.js"></script> <script type="text/javascript" src="/js/chartbeat.js"></script> <script src="/media/js/2010/feature_box.jquery.js"></script> <script src="/media/js/plugins/jquery.followbox.js"></script> <script src="/media/js/plugins/jquery.cookie.js"></script> <script> $(function(){ if($(".photolist").length > 0) $(".photolist").FeatureBox({}); }); </script> <!-- DW BEGIN --> <script type="text/javascript" src="http://dw-eu.com.com/js/dw.js"></script> <script type="text/javascript"> // page level settings DW.pageParams = { // required. each site will have its own id. siteId: '87' }; DW.clear(); </script> <noscript><img src="http://dw-eu.com.com/clear/c.gif?ts=1337810809&sId=87" height="1" width="1" border="0" alt=""></noscript> <!-- DW END --> <script type="text/javascript" src="/media/js/plugins/jquery.cookie.js"></script> <script type="text/javascript"> var tt_timeout, tt_cleartimeout, login_timeout; $(function(){ $("#nologin_window").dialog({ autoOpen : false, width: 350, height: 380 }); reposTooltip($("#atode"), $("#atode .ctooltip")); // Making the menu visible. This was set to prevent the // user from accidentally clicking the atode actions before // the page fully loaded $("#atode_pulldown_actions").show(); // Setting the last action var lastAction = $.cookie("ZDNET_ATODE"); if(lastAction && checkLogin){ var elem = $("#atode ." + lastAction); if(elem.length > 0){ $("#atode_pulldown .desc").hide(); $("#atode_action") .removeClass() .addClass(elem.attr("class")) .html(elem.html()) .show() .focus(); } } // Pulldown action select $("#atode_pulldown_actions dd").click(function(e){ var ahref = $("a", $(this)); e.preventDefault(); processAction(ahref); // Changing the primary action $("#atode_pulldown .desc").hide(); $("#atode_action") .removeClass() .addClass($(this).attr("class")) .html($(this).html()) .show() .focus(); }); // Main action event $("#atode_action").click(function(e){ var ahref = $("a", $(this)); e.preventDefault(); processAction(ahref); }); }); /* * Processes an atode action and displays a message if any * @param (Object) atode action */ function processAction(ahref){ if(!checkLogin()){ $("#nologin_window iframe").attr("src", "https://s.japan.zdnet.com/membership/login/?layout=dialog"); $("#nologin_window").dialog("open"); login_timeout = setTimeout(function(){modalLoginCheck();}, 1000); return; } var type = ahref.attr("name"); switch(type){ case "clip": case "mail": if(ahref.hasClass("disabled")){ if(type == "mail"){ setTooltipMsg("メールは2回送信できません"); } else{ setTooltipMsg("クリップ済み"); } } else{ $.getJSON( ahref.attr("href"), function(jresp){ // Popup message if(jresp.msg) setTooltipMsg(jresp.msg); } ); } break; case "print": window.open(ahref.attr("href")); break; case "dl": if(ahref.hasClass("disabled")){ setTooltipMsg("この記事はもうダウンロードされました"); } else{ window.location = ahref.attr("href"); setTooltipMsg("ダウンロードされました"); } break; default: break; } $.cookie("ZDNET_ATODE", ahref.parent("dd").attr("class"), {domain: 'japan.zdnet.com', path : '/'}); ahref.addClass("disabled"); } function checkLogin(){ return $.cookie("CNET_ID_LOGINED"); } function reposTooltip(parentCont, toolTip){ toolTip.css("top", "-" + (toolTip.height() + parentCont.height() + 2) + "px"); } function setTooltipMsg(msg, timeout){ timeout = timeout || 3500; $("#atode .ctooltip p").text(msg); reposTooltip($("#atode"), $("#atode .ctooltip")); $("#atode .ctooltip").fadeIn("fast", function(){ clearTimeout(tt_timeout); tt_timeout = setTimeout(function(){$("#atode .ctooltip").fadeOut();}, timeout); }); } function modalLoginCheck(){ if(checkLogin()){ // Login successful $("#nologin_window").dialog("close"); $(".loginAction .menuHead") .attr("href", "https://s.japan.zdnet.com/membership/") .text("CNET_ID Myページ"); $(".loggedOut").hide(); $(".loggedIn").show(); // Process the last action var ahref = $("#atode_action a"); processAction(ahref); } else{ login_timeout = setTimeout(function(){modalLoginCheck();}, 2000); } } </script> <script type="text/javascript" charset="UTF-8"> var _popIn_search_box = { "_popin_default" : { "action" : "/search/", "qname" : "?q={_popIn_word}" } }; var _popIn_customsearch_path = "http://japan.zdnet.com"; </script> <script src="http://api.popin.cc/searchbox/zdnet.js" type="text/javascript" charset="UTF-8"></script> <script type='text/javascript'> var _aiss_config = {uid: 1 , domain:'japan.zdnet.com/'}; (function(){ var ss = document.createElement('script'); ss.type = 'text/javascript'; ss.language = 'javascript'; ss.src = 'http://www.aiasahi.jp/media/sitesnapi/js/ss.js'; var cs = document.getElementsByTagName('script')[0]; cs.parentNode.insertBefore(ss, cs); })(); </script> </div> <!-- //block_elu --> </body> </html>