飛び出すカルーセルをUIZE Frameworkで作る（後編） (1/2)
（前編からの続き） 複数の画像を並べたカルーセルを作る 複数の画像を並べて表示するカルーセルを作成しましょう。はじめに、CSSを用意します。ここでは水平方向（横向き）用として以下のようなCSSを定義し、 「carousel.css」ファイルとして保存します。垂直方向（縦向き）のカルーセルを作成したい場合は、UIZE FrameworkのデモページにあるサンプルのCSSをコピーしてください。 /*** styles for thumbnails ***/ a.thumbnail, a.thumbnail:link, a.thumbnail:visited, a.thumbnail:hover, a.thumbnail:active { border:none; } a.thumbnail img, a.thumbnail:link img, a.thumbnail:visited img
飛び出すカルーセルをUIZE Frameworkで作る（前編） (1/4)
定番のカルーセルを作ろう Amazonでおなじみの「カルーセルパネル」は、最近ではさまざまなサイトで見かける定番のUIになりました。アニメーション機能に強いJavaScript/Ajaxフレームワーク「UIZE JavaScript Framework」（以下、UIZE Framework）でも専用のウィジェットが用意されており、カルーセルパネルを手軽に作成できます。 1枚の画像を切り替えるカルーセル はじめに、1枚の大きな画像を切り替えて表示するカルーセルを作ります。UIZE Frameworkのライブラリーファイルに含まれる「widget.slideshow.css」をコピーし、linkタグを使ってHTMLに読み込ませます。 <link rel="stylesheet" href="css/widget.slideshow.css"> 次にカルーセル用のオリジナルのCSSを定義します。
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
