html要素もポップアップできる便利なcolorbox
ページ内リンクつけるなら必須だと思うスムーズスクロール
でもこれを同じページで共存させようとするとなかなか厄介ですね、、。
どっちもa href=”#〜”を利用してるので、完全に競合します。
colorboxで使うリンクを#pop00などと固定しておいて、スムーズスクロールのscriptの記述で#pop〜を除外してもいいんですが
今回困ったのは、colorboxに閉じるボタンをaタグで設置したから！
先日の記事でご紹介した方法だと、
ポップアップ要素内に＜a href=”#” id=”close”＞閉じる＜/a＞って書いちゃって
javascript追加でできたんですが、このhref=”#”にスムーズスクロールが効いて、、、
閉じるをクリックすると、スムーズにスクロールするようになってしまいました。。
なんとか#をはずせないかと思っていたら、
aタグじゃなくて、buttonにしてしまえばよかったんですね。
記述は一緒。aをbuttonにするだけ！
さくっと問題なく設置できましたとさ。
配布されてるスムーズスクロールのjsによっては、効かせたくないタグにはカスタムデータ追加で除外できるってことだったので
それに置き換えようかとも思ったのですが
すでにscript内でcolorbox用のタグを除外させてたので、
その記述を消して、またcolorbox利用してる全部のタグに追記するのも、、、。と諦めました。
やらなくてよかった！
top