私は初めて jQueryUI をいじっているだけで、これで何ができるのかとても楽しみです。ただし、ページで box-sizing: border-box を使用しているため、すぐに問題が発生したようです。
たとえば、ページにこの基本的な HTML がある場合 (実際のページではアコーディオン タブ内のテキストがより多くなっていますが、これはデモ用です):
<div id='accordion'>
<h3>Header 1</h3>
<div>This is <a href="#">paragraph one</a>.</div>
<h3>Header 2</h3>
<div>This is <a href="#">paragraph two</a>.</div>
<h3>Header 3</h3>
<div>This is paragraph three.</div>
</div>
jQuery: でアコーディオンに変えることができます$('#accordion').accordion()。
ただし、 box-sizing が border-box に設定されている場合:
* {
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
box-sizing: border-box;
}
次に、アコーディオンセクションを開くたびに（最後に）非常に不快な「スナップ」があります。ボックスのサイズ設定を削除すると (永続的な解決策ではありません)、「スナップ」は消えます。
box-sizing を border-box に設定したという理由だけで、jQueryUI アコーディオンを使用できないということは本当にあるのでしょうか? ボックスのサイズ変更で動作するようにコードを変更できると思います...しかし、明らかにそれを避けたいと思います（部分的には、それを適切に行うのに十分な能力がないためです）。
これが以前に尋ねられたことがなかったことに驚いた...だから、それは私が気付いていない痛ましいほど明白な解決策だと推測している.
ありがとう！