「これが歳をとったということか・・・」なんてつくづく思ってしまう今日この頃。今回は、JSライブラリを使用するときに、「あぁ、そうだ、これをちょっといじれば同じことできるんだ」と今更ながら思ったことを、ざっくりと書こうかなと思います。『slick』というプラグイン。使っている方も多いはず。このプラグインを使っていて便利だな、と思うのは、イベントに合わせた処理を追加することが簡単にできるところです。console.log(nextSlide);});こんな感じで、何かしらのイベントが起こる時、起こる前などに処理を入れたい場合に、上記で対応が可能だったりします。使って複製を行っているプラグインなんかでは、絶対に欲しいものです。「あ、これいい!使いやすそう!・・・だけど、オプション少ないなぁ。定番以外の機能をサクッと実装したい場合、割とこんな感じの繰り返しで、条件にあったものがないか探したりします。結局、最初に「これ!」と思った以上のいい感じのものが見つからない・・・なんてこともよくある話です。こんなとき、slickにあるようなイベントオプションを自分で追加できれば、なんだか色々と解決できそうな気がしてきますよね。実装しているか、実際にコードを見てみます。関する内容はここだけにしか登場しません。実行させる、たったこれだけです。実践では、これをイベントオプションのないライブラリにいれて見ましょう。今回は、コンテンツをエンドレスに流してくれるスライダー『endress-river』をみてみましょう。ボタン表示の3つしかありません。実行させるようにしてみます。HTML、CSS、JSは公式のものを使用します。公式JSの49行目、「//BOOT」のコメント行の前に、「$line.trigger('test');」といれて見ます。呼ばれることを確認して見ましょう。$(this).after('<p>追加してみたよ!</p>')}).endlessRiver();サンプルをCODEPENに置いて見ました。「追加してみたよ!」の文字列が入っているのと、本ページを開発者ツールで開き、コンソールを確認すると、「TEST!!!!!」が表示されていますね。CodePen.しめライブラリをあまりガシガシいじりたくない、でもカスタマイズしないと求めているものが得られない・・・そんな時に使うこともできますね。Compressionで画像をアップロード前に圧縮する[Javascri...JavaScriptfujihara2021.03.08バシャログ。Web制作スタッフによるブログです。「現場で使えるテクニック」をモットーに、Web制作全般についてお届けします。