レスポンシブで作成したLPの電話番号をPCとスマホで別にする、という依頼が。CSSで対応しても良いのですが、電話番号の表示箇所の数が多いので、ソースが煩雑になりますし、CSSのメディアクエリは厳密にPCとスマホを分けてい…
Slider Proのレスポンシブ処理について
スライダーの中で、文字テキストや画像を個別にアニメーションさせたい時、一番多く使うのが「Slider Pro」なのですが、レスポンシブの時、スマホだと画像のサイズがうまく調整できないことがあります。「Slider Pro…
wow.jsのアニメーションをリピートさせたい
手軽なアニメーションの導入方法として、みんな大好き wow.js。 こういう使い方がシンプルなスクリプトは便利ですが、もし弱点をあげるとすれば、一度表示してしまったアイテムは二度とアニメーションしないこと。 何度表示して…
お手軽なアコーディオン
スマホの時だけアコーディオンにしたいなと思って、動作が軽くて簡単なコードを探しました。 CSSのメディアクエリを外せば、PCにも使えます。
Slider proでSP版の画像サイズの縮尺を調整する
Slider proのsp-layerに画像を入れた場合、autoScaleLayersにすると、自動的に元のスライドサイズ（プロパティでwidthに設定したサイズ）を参照して、一定の縮尺で表示してくれます。 これが小さ…
Slider Proのレイヤーアニメーションの指定方法
必要な項目がコンパクトに揃っていて大変便利です。 直接表示させるテキストなどに指定します。 https://github.com/bqworks/slider-pro <p class=”sp-laye…