My Vector Space

  人生は寄り道してなんぼ

JQuery

サムネイルプレビュー付きスライダー 【 Sweet Thumbnails Preview Gallery 】

サムネイルプレビュー付きスライダー。 demo 記述はまず、対象とする<img>タグにhtmlタグを追加してから、ダウンロードした外部ファイル(http://tympanus.net/codrops/2011/01/19/sweet-thumbnails-gallery/)のCSS、Javascript、JQueryをリンクさせる、と…

画像をオーバーレイで表示する「LightBox」プラグイン

多くのLightBoxプラグインがprototypeで動くものが多い中、JQueryで実装することのできる「LightBox」プラグインです。 手順は、ダウンロードしたファイルをhtmlファイルの任意の箇所に設置し、対象となる画像にタグを指定すれば完了です。 細かくみていくと…

「FlexSlider」を使用して複数の画像をスライドショーさせる

作業内容は三箇所 ● htmlのhead内にJQuery本体と各ファイルを読み込ませる。 ● 同じくhtmlのhead内にスクリプトを記述する。 ● body内にあるスライドショーをさせたい要素に「class="flexslider"」を設定。 細かい部分を見ていくと、 head内にJQuery本体と外…

グローバルナビやページ途中にある要素を スクロール時にトップに固定するJQuery

作業内容は3箇所 htmlのhead内にjQuery 本体と各ファイルを読み込ませ、スクリプトを記述 body内の固定したい要素に「id=”fixedBox”」を設定 固定するための設定をcssに記述 細かい部分を見ていくと、 まずhtmlのhead内に jQuery 本体と各ファイルを読み込ま…

JQueryを使うための準備 手順

JQueryを使うための準備 手順 1 : まずはスクリプトを動かすために必要な JQuery のファイル( 本体 )をhead 内に設置する。 2 : プラグイン本体を設置し、色々なスクリプト(実行コード) を書いていく。 細かい部分をみていくと、 1 : まずはスクリプトを動か…

PAGE TOP