スライス画像クリック型フォトギャラリー

 全スライド枚数で等分したスライス画像(このデモではスライド枚数が5枚なので、5等分した画像)を、一枚分のスライドになるように水平に並べ、各スライスをクリックすると該当する画像がフェイドインするタイプのフォトギャラリーで … 続きを読む

スライス画像遷移型スライドショー

 全スライド枚数で等分したスライス画像(このデモではスライド枚数が5枚なので、5等分した画像)を、一枚分のスライドになるように水平に並べ、これを、スライドの切り替え時に表示するタイプのスライドショーである。文章で読むとよ … 続きを読む

フォトギャラリー型ポートフォリオ

 グリッド状に配置された画像がナビゲーションとなり、そのクリックで、その画像が拡大され、説明文が表示される。cssアニメーションらしく、ここまでがシームレスで表示される。このまま、単なるギャラリーとしても使えると思うが、 … 続きを読む

複数画像移動型スライダー

 ヘッダー部分に設置するスライダーは従来一つのスライドが入れ替わるものが多いが、サイトによっては、いくつかのスライドを水平に並べて表示し、全体がスライドして入れ替わるものも見受けられる。ここでは、全体を8枚のスライドとし … 続きを読む

オールインワン型スライダー(サムネイル付き)

 ページのヘッダー部分に表示するスライダーで、表示スライドの前後のスライドの部分を左右に表示するタイプで、スライド下部にサムネイルを水平に並べて、そのクリックでそのスライドに飛べるようにしたものを作成した。  画面サイズ … 続きを読む

サムネイル移動表示・Fade-In型フォトギャラリー

 これまで、サムネイルの数が5つの場合についてサンプルを作成してきた。もっとスライドの数が増えた場合(この例では10枚)の対処として、サムネイルが左右に移動して全部が現れるようにし、サムネイルのマウスオーバー時に、サムネ … 続きを読む

円運動サムネイル拡大型スライドショー

サムネイル画像が連なって円運動している状態で、水平になったサムネイル画像を拡大して、表示枠いっぱいに表示させるタイプのスライドショーである。 このサンプルでは、幅600pixの写真を表示させているが、他のサイズの写真をそ … 続きを読む