スマホサイトで画像が横にスライドしつつ端だけ見切れて表示されるスクリプト
つまり見切れるスクリプトを組んでほしいっと言われて、
こんな時はｊクエリエモーン…ありました。slick
そして
jQueryのslick.jsを使って 画像を流すスクリプトを構築してみたけど
カルーセル下のドット画像がどーしても表示されない
何度見返しても、何度ダウンロードしても
gitからslick-themeを持ってきてfontsも全部入れて
何度も何度もやり直してみたけどさっぱり
ドットが表示されないので
それこそ無駄に何日も費やして
それでもできないので、もう
CSSでそれっぽいボタンを作ることに
ということでそのソース
.slick-dots li button:before{
background: #EEE;
border: 3px solid #666;
border-radius: 70px;
color: #666;
width: 10px;
height: 10px;
}
これでbeforeの色だけ作って
あとは画像が移動したら
ボーダーの色が濃くなるので
濃くなった色がメインで表示されてる
BASICならcircle (ｘ,ｙ),10とか書いてるとこだぜって
不毛なことを考えながら
できたしこれでいいかなって思いながら
この案件は満足しないまま終了。
コメント