jQueryで関数が競合？していて処理が実行されない

Question

前提・実現したいこと

JavaScriptにおいて、１つのページ内で以下の２つのライブラリを両方使いたいです。
・右クリックメニューの変更
https://github.com/swisnl/jQuery-contextMenu
・ボタンによるサイズの変更
https://dad-union.com/javascript/87

実際のページ
https://jsfiddle.net/mcsnpwy1/8/

発生している問題・エラーメッセージ

しかし以下のエラーが出て、右クリックメニュー変更の処理が動きません

Uncaught TypeError: $.contextMenu is not a function

ソースコード自体はサンプルをそのままコピペしただけなので、それぞれ個別だとちゃんと動作します。

試したこと

エラーメッセージで調べてみて、jQueryの競合が問題だと思い、
$を再定義したり初期化したりしてみましたがうまくいきませんでした。
Uncaught TypeError: $ is not a function の解決方法
jQueryで「… is not a function TypeError:」のエラーが出る場合のjQuery.noConflictでの対処

他に何か原因があれば教えて頂きたいです。
よろしくお願いします。

Answer 1

jQueryの競合が問題だと思い

はい、jQueryを2つ読み込んでいるので、あとの方を削除してください。

あと、$(window).loadとしてloadイベントを取るのはjQuery 3.0で廃止されています（公式）。今の書き方に直せば$(window).on('load', 関数)のようになりますが、特にloadまで待たせる意味がないのであれば、$(関数)で構わないと思います。

Comments

[K-actus]

迅速な回答と補足情報ありがとうございました！