私は自分の液体ページに外部jQueryライブラリを統合するのに苦労しています。私はCDNでそれをロードしたいと思います。 theme.liquid
ページでLiquid/Shopify:jQueryをページに追加する方法は?
私はJavascriptをロードするこの方法:spot-the-ball.js
インサイド
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
{{ 'spot-the-ball.js' | asset_url | script_tag }}
私はworkigある純粋なJavascriptを.onload
機能を持っています。そして、私が働いていないこと、次のjQueryを持っている:
$('.coords').mousemove(function (e) {
// console.log(e.clientX);
// var x = ((e.clientX - left)/width).toFixed(1),
// y = ((height - (e.clientY - top))/height).toFixed(1);
x = e.clientX - 50;
y = e.clientY - 50;
$(tooltip).text(x + ', ' + y).css({
left: e.clientX - 30,
top: e.clientY - 30
}).show();
});
$('.coords').mouseleave(function() {
$(tooltip).hide();
});
$(".coords").mouseup(function(){
$('.yourcoordinates').append("X:",x," Y:",y)
}); $('.coords').mousemove(function (e) {
// console.log(e.clientX);
// var x = ((e.clientX - left)/width).toFixed(1),
// y = ((height - (e.clientY - top))/height).toFixed(1);
x = e.clientX - 50;
y = e.clientY - 50;
$(tooltip).text(x + ', ' + y).css({
left: e.clientX - 30,
top: e.clientY - 30
}).show();
});
$('.coords').mouseleave(function() {
$(tooltip).hide();
});
$(".coords").mouseup(function(){
$('.yourcoordinates').append("X:",x," Y:",y)
});
チェックは、単純な 'はconsole.logを書く(「テスト」) 'を読み込み、JSがロードされているかどうかを確認します。次に、' console.log($( '.coords').length) 'をターゲットにする前にターゲット要素が実際にロードされているかどうかをチェックします。あなたがこのように問題を見つける時間の99%。 – drip
あまりにも間違いがあったので、誰もが解決策を見ることができるように私自身の質問に答えるつもりです。ありがとうございます –