[jQuery][Web]mixitupを利用した動きのあるギャラリーサイト

jQuery Web

MixItUpmixitup.kunkalabs.com

2015-06-30

[jQuery]フェードアニメーション

jQuery

リストとpositionレイアウトを利用し、次々に画像をフェード表示させる。

2015-06-14

[jQuery]固定背景/スムーススクロール/追従ボタン/Twitter組み込み

jQuery

jQueryを利用した縦長シングルページの作成固定背景→bodyに背景画像を設定、ページサイズが変動してもつねに中央に前面表示されるスムーススクロール→スピードを設定できるスクロール jQuely 追従ボタン→position:fixedで作成追従ボタンを一定の高さでフ…

2015-06-12

[jQuery] [jQuery]bxSliderとLightBoxを使ってメインを装飾したページ

jQuery

「パスタ屋」のページを製作トップイメージにbxSlider、クリックするとLightBox 必要なものだけを使う(javascript本体、css、イメージ) jQuery本体（ＣＤＮでよい） bxSlider⇒jquery.bxslider.js、jquery.bxslider.css、アイコン画像 LightBox⇒lightbox.js…

2015-05-28

[jQuery]⑨タブパネル

jQuery

見出しタブをクリックすると、パネルの内容が切り替わるUI 情報量を多くできる大手ポータルサイトでよく見かけ、馴染み深いスライド/フェードアニメなどを適用してもよい(濫用はNG)

2015-05-27

[jQuery]⑧横アコーディオンパネル

jQuery

画像の横アコーディオンパネル定義リストを利用するタイトル部分をクリックすると、画像とともに横にスライドする情報の多くしたいヘッダー画像などに利用したい <html> <head> <meta charset="UTF-8"> <title>イメージアコーディオン・横</title> <link rel="stylesheet" href=“acord2.css"> <script src="js/jquery-1.11.3.min.js"></script> </head> <body> <div id="container"> <dl> <dt></dt></dl></div></body></html>

2015-05-21

[jQuery]⑦アニメーション効果

jQuery

show() 非表示状態の要素を表示 hide() 表示中の要素を非表示にするセレクター :animeted アニメーション処理中の要素を選択 toggle() 要素の表示、非表示を交互に切り替え slideDown/slideUp() 表示非表示をスライドで切り替え slideToggle() 表示/非表示…