レスポンシブ対応でjQuery不要の高機能スライダー「Swiper」 | Will Style Inc.｜神戸にあるウェブ制作会社
こんにちは、デザイナーの奥田です。 最近フロントエンドでは「脱jQuery」なんて言われていますね。 まだまだjQueryバリバリ書いてますって方もちょっとずつ「脱jQuery」していくとこの先もスキルが活かせると思います。 さて、今回は「もう最近の案件はこれしか使っていないんじゃないか？」というぐらい高機能で便利なスライダーをご紹介いたします。 Table of contentsSwiperの使い方カルーセル表示にするレスポンシブに対応するPC時はグリッド表示、スマホ時にスライドにするサムネイル付きカルーセル表示その他オプションまとめSwiperの使い方まずは普通に使ってみましょう。下記よりファイルをダウンロードするかCDNでの使用でも実装できます。 SwiperCDN CSSとJSを読み込みます。 <html> <head> <link rel="stylesheet" href="h
紙のページをめくるような動き - Qiita
概要 クリックすると紙の書類をめくるようにページを送る 実際の書類を読むときのように、初期配置と送ったページでz-indexを反転させる jQuery使用 クリックしたときのページの重なり順など改善予定 デモ http://codepen.io/viscosenpai/pen/bqNvdy コード <div id="wrapper"> <section class="page"> <h1>Title-1</h1> <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Quidem ad totam dolores voluptatem sint voluptate saepe qui? At quas rerum magnam iusto, illum. Vel quidem nisi eum ipsam quae bla
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
