Lightboxの進む戻る矢印を画像枠の外に出すカスタマイズ
Lightboxの進む、戻る矢印を画像の外へ出すカスタマイズのメモ。
lightbox.cssを変更
.lb-nav a.lb-prev {
.....
position: absolute; // 追加
left: -80px; // 0から-80pxへ変更
.....
}
lb-nav a.lb-next {
.....
position: absolute; // 追加
right: -80px; // 0から-80pxへ変更
.....
}
進む、戻る矢印はデフォルトではマウスオーバーした際に表示される。
マウスオーバーしなくても表示させるには下記のように変更する。
.lb-nav a.lb-prev {
.....
opacity: 1; // 0から1へ変更
.....
}
.lb-nav a.lb-next {
.....
opacity: 1; // 0から1へ変更
.....
}
コメント
No comments yet.
コメントの投稿
改行と段落タグは自動で挿入されます。
メールアドレスは表示されません。