必要な項目がコンパクトに揃っていて大変便利です。
直接表示させるテキストなどに指定します。
https://github.com/bqworks/slider-pro
<p class=”sp-layer sp-white sp-padding hide-medium-screen” data-horizontal=”315″ data-vertical=”50″ data-show-transition=”left” data-hide-transition=”up” data-show-delay=”800″> consectetur adipisicing elit. </p>
【data属性】
水平位置垂直位置登場時のアニメーション方向消える時のアニメーション方向登場時の遅延時間消える時の遅延時間
data-horizontal=”50″ | 水平位置 |
data-vertical=”50″ | 垂直位置 |
data-show-transition=”left” | 表示時のアニメーション方向 |
data-hide-transition=”up” | 消去時のアニメーション方向 |
data-show-delay=”400″ | 表示時の遅延時間 |
data-hide-delay=”200″ | 消去時の遅延時間 |
【class】
画面がsmallサイズの時非表示文字の背景を白文字の背景を黒
sp-layer | レイヤー指定 |
hide-small-screen | 画面サイズsmallの時非表示 |
sp-white | 背景白に |
sp-black | 背景黒に |