slick 基本
ダウンロード
http://kenwheeler.github.io/slick/
使うデータ
ajax-loader.gif
fonts(フォルダ)
slick-theme.css
slick.css
slick.min.js
HTML
jQuery本体の設置。
CSSファイルの後にslickを設置。
<link href="js/slick-theme.css" rel="stylesheet" type="text/css">
<link href="js/slick.css" rel="stylesheet" type="text/css">
<script src="jquery本体"></script>
<script type="text/javascript" src="js/slick.min.js"></script>
<ul class="slider">
    <li><a href="#"><img src="images/i01.jpg" alt=""></a></li>
    <li><a href="#"><img src="images/i02.jpg" alt=""></a></li>
    <li><a href="#"><img src="images/i03.jpg" alt=""></a></li>
    <li><a href="#"><img src="images/i04.jpg" alt=""></a></li>
</ul>
js
$('.slider').slick();
$('.slider').slick({
    autoplay:true,
    autoplaySpeed:8000,
    dots:true,
});
                                    HOME > javascript > slick 基本
javascript
- Slick Slider滑らかに逆スクロール|画像の幅が違う
 - slick sliderで逆にすると画像が表示されなかったり途中で切れる場合
 - slick sliderのサムネイルを縦に流す
 - formのoninput-output。結果を3桁ごとにカンマが入る数値タイプに変換
 - マウスオーバー・マウスアウト(スマホの時はクリック)で画像を切り替えるjquery。
 - querySelectorAllエレメントのhrefをforEachで削除する
 - jQuery,Masonry,imagesloadedで画像を敷き詰める
 - jQueryで特定のページからリンクされた後のページでclassを追加
 - カレンダー
 - 特定の要素を持っていたら(あったら)jQuery
 - スクロールすると上からニョキッと降りてくるメニューjQuery
 - マウス・マウスホイールで横スクロールするjavascript
 - 横スクロール要素をマウスホイールで動かせるjavascript
 - jqueryとcssでタブ
 - 特定の要素を持つ時にclassを付けるjQuery
 - スクロールして現れたらアニメーション(フェード等)開始jquery
 - MOREボタンで数件ずつ要素を表示wp
 - スクロールして表示するとフェードイン
 - スクロールして表示されたタイミングでアクションを起こすjs
 - スクロールするとメニューが上からゆっくり降りてきてヘッダー固定・Y座標0でメニューがスムーズに上がる(消える)
 - Enterキーを押すとinputが空欄になるのを防ぐ
 - jsでふわふわ縦に揺れる
 - 特定の要素の幅と高さを取得するjavascript
 - ウィンドウ幅リサイズごとにブラウザをリロードするjavascript
 - サイトにローディングを実装するjavascript
 
                                
                            
                            

