画像比較がドラッグでできるjsを作りました。
query_builder2019/08/03
sell
画像のビフォー・アフターをドラッグで切り替えて比較できるようなjsを作成しました。スマホにも対応していて、jQueryなしで、ピュアなjavascriptで作成しました。導入は簡単なので、是非使ってください。
画像のビフォー・アフターをドラッグで切り替えて比較できるようなjsを作成しました。スマホにも対応していて、jQueryなしで、ピュアなjavascriptで作成しました。導入は簡単なので、是非使ってください。
phpの配列からjsonを作成する方法と、phpにjsonを読み込んで配列として使用する方法を紹介します。意外に使うシーンが出てきますので、覚えておいて損はないです。
jQueryプラグイン「Magnific Popup」の矢印(arrow)、閉じるボタン(close)、カウンター(counter)のカスタマイズ方法を紹介します。オプションが用意されているので、比較的簡単にカスタマイズできます。
今回はdisplay: grid; を利用して、よくあるサイトの構成や、画像とテキストコンテンツをずらして重ねるといったレイアウトを作成しました。従来のコーディングよりも、htmlやcssの記述が少なくなりました。これを参考にして、みなさんもグリッドレイアウトを使ってみてください。
何度か取り上げているslick.jsの使い方ですが、今回はサムネイル付きスライダーを作成します。サムネイルがスライダーのものや、サムネイルを固定した(サムネイルをスライドさせない)スライダーなどいくつか紹介します。