環境構築ができたら早速サンプルプロジェクトを作成します。 １．プロジェクトを作成 Eclipseを起動し、「ファイル -> 新規 -> Web -> 動的Webプロジェクト」でプロジェクトを作成。 プロジェクト名を適当に決め(ここではGwtExtSampleとします)、構成をGWT用 Cypal Studioに設定します。 それ以外はデフォルト設定で完了。 ベースプロジェクトが出来たら「ファイル -> 新規 -> その他 -> Cypal Studio -> GWTモジュール」を選択。 ソースフォルダーは先ほど作成したプロジェクトのソースフォルダを指定。 パッケージは好きなように。(ここではsampleとする) 名前も適当に。(ここではHelloworld) 設定完了後、完了ボタンを押す。 するとプロジェクトが構成されます。 ２．外部jarの設定 作ったプロジェクトにライブラリを追加する。
このドキュメントの内容は、以下の通りです。 はじめに インラインイメージとは base64 とは インラインイメージの指定方法 指定できる主なコンテンツタイプ インラインイメージの使用例 PHPを用いて画像をbase64する方法 PHPで画像をbase64エンコードして、imgタグに指定する方法 node.jsで画像をbase64エンコードする方法 Unixコマンドで画像ファイルをbase64エンコードする方法 はじめに ウェブページをはやく表示するテクニックはいろいろあります。たとえば、ページや画像などのリソースのサイズを小さくしたり、画面を表示するためのHTTPリクエストの数を減らす、といった手法があります。 HTTPリクエストの数を減らすためのテクニックを例に挙げます。 インラインイメージ CSSスプライト(CSS Sprite) イメージマップ 今回は、インラインイメージについて紹
テキストエリアに、Ajax通信で出力した改行付の文字列をテキストエリアに挿入するとき、コードの書き方によってはIEで改行が反映されなくなってしまいます。 テキストエリアに、Ajax通信で出力した改行付の文字列をテキストエリアに挿入するとき、例えば $.get("?id=" + val, function(txt){ $('textarea[name="body"]').append(txt); }); のようにするとappendやprependなどではIEでは改行されません。（空白になる。） $.get("?id=" + val, function(txt){ tmpTxt = $('textarea[name="body"]').val(); $('textarea[name="body"]').val(tmpTxt + txt); }); 一旦val()で取得しておいて、それに挿入した
かなり人気のあるjQueryですが、そんなjQueryの私個人が選ぶ素敵なプラグインとチュートリアル10選。 とりあえず定番的なものをどうぞ。 ちなみにjQueryを自作できるレベルまで手軽になりたい人は以下記事参照。 web制作の現場で使うjQueryデザイン入門が激しくお勧めな件 タグクラウドの細分化 jquery Hover Sub Tag Cloud - Noupe サンプルデモ これかなり好き。 タグクラウドをさらに細分化させて表示させてます。 こういう発想は今までなかったので最初見たときちょっと感動しましたね。 ローディングページ How to Load In and Animate Content with jQuery | Nettuts+ サンプルデモのメニュー部分をクリックしてみてください。 右上にローディングのマークが若干出て、さらにアコーディオン風に内容が変わります
こんばんは、最近ホルモン焼きにハマっているishidaです。 WEBサイト制作時、formは必ずといってもいいぐらい存在します。 お問い合わせフォームや会員登録フォームなどがすぐに思いつきますよね。 デザインをがっつりフォーム部分で作り込んでも、CSSのみでは、 実現できなかったりすることもよくあります。 そんなクセのあるformを、よりリッチに！かつ操作性を向上！できるjQueryプラグインの数々をご紹介します。 デザイナーの方は、フォームのデザインの参考に。 コーダーの方は、ページ作成時間の短縮に手助けになればと思います。 jQuery plugin: Validation フォームの入力チェック（バリデーション）が簡単にできるプラグイン。 エラーメッセージはlocalizationディレクトリ内に18言語用意されています。 日本語用は別途作成し、使用することが可能です。 jQuery
2014年8月20日 jQuery いつも使っているラジオボタンやチェックボックスにもっと彩りを！ここではCSSとjQueryを使ってiPhone風のデザインに変える方法を紹介します。使用する画像は一枚のみ。CSSスプライトで表示位置を変えます。サンプルも用意してみたので覗いてみてくださいね！ ↑私が10年以上利用している会計ソフト！ サンプルはこちら。IE7, IE8, FF, Chromeで正常動作 See the Pen Mobile like radio/check buttons by Mana (@manabox) on CodePen. ファイルを準備 必要なファイルを準備します jQuery こんな感じの画像を作る コーディング ファイルを読み込む ヘッダー内にjQueryを読み込ませます。 <script type='text/javascript' src='/samp
jQueryでチェックボックスをすごい形にカッコよくしちゃう方法が紹介されていました。 具体的なデザインは以下。もうチェックボックスの原型がないという、面白くて分かりやすいＵＩに調整されています。 マークアップ上も、次のように綺麗になっています。 実際のタグは、不可視にしちゃって、jqueryによって、on/off を切り替えればいいわけですから、まさに何でもありで、参考にして他にも面白く、使いやすいデザインはいくらでも作れるかもしれません。 jQueryによるクロスブラウザ対応が出来るので、昔のように神経質になる必要もないですね。 詳細は以下のエントリから参照。 Pretty checkboxes with jQuery | Aaron Weyenberg
最近、jQueryにハマっているishidaです。 CSSコーディングで角丸処理をする場合、たいていは上下の角丸部分を画像として切り出して、そんでもって背景画像を適用してという風にします。 また最近では、角丸を作るjavascriptライブラリーなどがあります。 でもdiv要素が増えたり、なんだかソースがすきっりしないぜぇ～と思っていましたがイイものがありました。 私がハマっているjQueryで角丸をつくるjQuery curvyCorners。 jQuery curvyCornersサンプル まずjQueryサイトからjquery-1.2.1.pack.jsファイルを入手。次に jQuery curvyCornersサイトからjquery.curvycorners.packed.jsファイルを入手。 使いかた まず、上記で入手したjsファイルをインクルード。 <script src="j
サンプル ライティング テキストテキストテキストテキストテキストテキストテキスト。 XHTMLコーディング テキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキスト。テキストテキストテキストテキストテキストテキストテキスト。 カンプデザイン テキストテキストテキストテキストテキストテキストテキストテキストテキスト。 CSSコーディング テキストテキストテキストテキストテキスト。テキストテキストテキストテキストテキストテキストテキストテキストテキスト。 ソース XHTML <ol class="list611"> <li> <dl> <dt>ライティング</dt> <dd>テキストテキスト......</dd> </dl> </li> <li> <dl> <dt>XHTMLコーディング</dt> <dd>テキストテキスト......</dd> </dl
Indicator type : Background color : # Transparent background Foreground color : # Create easily your own ajax loader icon : Select the type of indicator you want Enter the background code color you want (tick "Transparent background" if you don't want one Enter the foreground code color you want Press "Generate it"
「エレメントの子ノードリストを取得」サンプルコード <html> <head> <title>element.childNodes - エレメントの子ノードリストを取得</title> </head> <body> <!--エレメントの子ノードリストを取得のサンプル--> <div id="parent" class="daddy"> <div id="sample"><span>1</span><span>2</span><span>3</span><span>4</span><span>5</span></div> </div> <script type="text/javascript"> function findElement() { var element = document.getElementById("sample"); var childs = element.chi
Home | 目次 | Prev | Web Safe Color | Next ■ Web Safe Color (カラーチャート) Wabにおける SafeColorパレット #0000ff #00f RGB(0,0,255) #0033ff #03f RGB(0,51,255) #0066ff #06f RGB(0,102,255) #0099ff #09f RGB(0,153,255) #00ccff #0cf RGB(0,204,255) #00ffff #0ff RGB(0,255,255) #0000cc #00c RGB(0,0,204) #0033cc #03c RGB(0,51,204) #0066cc #06c RGB(0,102,204) #0099cc #09c RGB(0,153,204) #00cccc #0cc RGB(0,204,204) #00ffcc
FireFox3になってから、getElementsByClassNameがNativeSupportされたので、I.Eとの互換性がメンドイよねっていう話。 とりあえず、 <body bgcolor="#cccccc"> <ul> <li class="b">bbb</li> </ul> <ul id="hoge"> <li class="a">1</li> <li class="b">2</li> <li class="c">3</li> <li class="d">4</li> <li class="e">5</li> </ul> </body> っていうHTMLがあった場合、 $('hoge').getElementsByClassName は、IE/FFどちらでもちゃんとFunctionとして定義される。それは、$関数が最後にElementをElement.extend(eleme
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
