ちょっと複雑なクリッカブルマップを作る！
というミッションがございました。
以前はAdobeのDreamweaverで作成してましたが、
今ってどうなの？と調べると
クリッカブルジェネレーターというツールがweb上にある。
なんてありがたいこと。
簡単にクリッカブルのソースが作れます。
クリッカブルジェネレーター
それを、もちろんレスポンシブにしなきゃだよねー。
と別に調べるとこちらも、ソースをおいていただいている。
本当にありがとうございます。
※以下をページの下部</body＞の前に張り付けたら
クリッカブルソースもレスポンシブになります。
<!– クリッカブルリサイズjs –>
<code>
<script src=”https://cdnjs.cloudflare.com/ajax/libs/image-map-resizer/1.0.10/js/imageMapResizer.min.js”></script>
<script>
imageMapResize();
</script>
</code>そして、ページ内の移動もスムースに行いたい。
と思うわけで、、、
CSSで1行で簡単にスムーススクロールを実装できる「scroll-behavior」プロパティ
scroll-behavior: smooth;
の1行でスムースになります。
※ブラウザ対策が必要
それにしても便利な時代です。