ささきしき

チラシ

jQueryのslim_buildにはanimate()も入ってない

表題がすべてですが、念のため確認。

背景

Semantic-UI のモーダルを使いたかったので、こんな感じで呼んでいた

<!doctype html>
<html lang="ja">
<head>
<!-- 略 -->
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/semantic-ui/2.3.3/semantic.min.css" />
<script src="https://code.jquery.com/jquery-3.3.1.slim.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/semantic-ui/2.3.3/semantic.min.js"></script>
</head>
<body>

<!-- 略 -->

<button onclick="$('#Modal').modal('show'); return !1;">push</button>
<div id="Modal" class="ui modal">

<!-- 略 -->

そしたら妙な挙動を起こしてエラー吐いて止まるんですね。エラーは以下。

Uncaught Error: Syntax error, unrecognized expression: unsupported pseudo: animated

はて何ぞやと確認して回ったら、jQuery の slim build には Ajax のほかに effects (animate) も入ってないのが原因と発覚。
改めて普通のに差し替えたら何事も無く動きましたとさ。

- <script src="https://code.jquery.com/jquery-3.3.1.slim.min.js"></script>
+ <script src="https://code.jquery.com/jquery-3.3.1.min.js"></script>

参考

You can also use the slim build, which excludes the ajax and effects modules:

https://jquery.com/download/