マークアップエンジニアとかWEBディレクターとかをやってる僕が、自分が詰まって、解決したことをここに残しておきますよ。

slickでasNavForでサムネイルを設定したがスライダーが動いている途中に次のスライダーをクリックしても効かない

便利なslick

asNavForというオプションをつかえば、スライダーと連動するサムネイルも作れるよね。

ただ困ったことがあって、たとえば4秒でスライダーが切り替わるように設定している場合、その4秒間の間に別のサムネイルをクリックしても動いてくれないことがある。

お客さんがサムネを連打したりすると「なんかちゃんと動いてません」という修正指示がくる。

slick asNavFor moving bugとかで検索したけど出なくて、よくやく自力で解決。

なんとオプションがありました。

waitForAnimate:true

このwaitForAnimateというのはアニメーションしてある間は他の操作をうけつけずに待機する、という機能で、デフォルトではtrueになっている。

これのおかげで遷移中にサムネイルをクリックしたり矢印(arrows)をクリックしたりしてもうまく動かなかったというわけだった。

この機能はもちろんあっていいんだけど、デフォルトはfalseにしておかないと不便だよね。まったく。


というわけでオプションはこんな感じになったよ。


$('.slider').slick({
asNavFor: '.slider-nav',
infinite: true,
autoplay: true,
autoplaySpeed: 4000,
dots:true,
arrows:true,
pauseOnHover: false,
fade:true,
waitForAnimate:false,
speed: 1000
})

$(".slider-nav").slick({
asNavFor: '.slider',
slidesToShow: 5,
waitForAnimate:false,
focusOnSelect: true
});



codekitの自分が触ってるプロジェクト以外のファイル更新で自動リロードがかかるのを防ぐ

codekit使ってます。

codekitの一番いいのが自動リロード機能。
htmlを更新した時に自動でブラウザをリロードしてくれる。cssを更新したときには、ブラウザをリロードせずにcssだけをヌルっと変更してくれるので、ページの途中を作ってる時や、jsでひらいたメニュー内を作ってるときも大活躍する。

その自動リロードで悩ましいことが1つあった。

うちの会社で複数の人間がcodekitをつかってそれぞれの案件をコーディングしてるとき、自分が作業中のファイルを更新してないのに、dropbox内の別のプロジェクトを誰かがいじっていると彼のいじったファイルが更新されたことでこっちまでオートリロードかかっちゃうことがたびたびあって。

cssをちょこちょこいじってるのに勝手にリロードかかってページの上にぶっとばされるのは非常にストレスなので、どうにかなんねぇのかな、と思ってたら、

普通にどうにかなるやつだった。

codekitのプロジェクト一覧をひらくと、ズラッと並んでるプロジェクトの右側にチェックボックスがある。
自分が触ってないプロジェクトに関してはこれをはずしてdisableにしておくだけ。

こんな簡単なことなら、さっさと調べたほうがよかったね。


スニペットツールDashの自動入力が使えなくなったのを解決

Dashというスニペットツール、コーディングで使っていた。

mac book proを3年ぶりに買い替えて(それによってOSもsierraになって)みたら、使えなくなってしまった。
Dashをたちあげて「use」をクリックしてペーストするのは機能するんだけど、文字を打ち込みながら自動で入力される機能が動かない。

自動で入力されないと意味ないんだYOーーーーーーーーーーーーーー!!

んで、なかなか調べても解決策みつからなかったんだけど、ようやく見つけた。

システム設定でDash appのアクセスを許可してなかったんだね・・・。


システム>セキュリティとプライバシー>アクセシビリティ


dashcapcha

このキャプチャではうつってないけど、左下のカギマークをクリックしてパスワードをいれたあと、Dash.appにチェックをいれる!

そうしたら直った。

やれやれだぜ
記事検索


手ぶらで通話 - bluetoothヘッドセット

1時間1円で暖かい。電気毛布。

夏のPC仕事のおともに冷えピタ。クールヘッドで脳のスピードがあがります。

お仕事のご依頼・お問い合わせはこちら

コーディングのお仕事が得意です。

info(あっと)tacshock.com
タグクラウド
QRコード
QRコード
  • ライブドアブログ