カスタムボックスjQueryプラグインを使用していますが、ページの準備ができたときにモーダルダイアログを表示させたいと思います。
これは私の現在のコード(JS部分)です:
<script>
$( document ).ready(function() {
$.fn.custombox( this, {
overlay: true,
effect: 'blur',
url: '#modal'
});
e.preventDefault();
});
</script>
そしてこのコード(HTML部分):
<div id="modal" style="display: none;" class="modal-example-content">
<div class="modal-example-header">
<button type="button" class="close" onclick="$.fn.custombox('close');">×</button>
<h4>jQuery Custombox</h4>
</div>
<div class="modal-example-body">
<p>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.</p>
</div>
</div>
何が間違っているのかわかりません。誰かがそれを機能させる方法を教えてくれることを願っています。
'this'を関数に渡す代わりに、正しい要素を渡す必要があります。したがって、最初にモーダルdivを選択します。このコードを試してください:
<script>
$( document ).ready(function() {
var modal = document.getElementById('modal');
$.fn.custombox( modal, {
overlay: true,
effect: 'blur',
url:'#modal'
});
});
</script>
この記事はインターネットから収集されたものであり、転載の際にはソースを示してください。
侵害の場合は、連絡してください[email protected]
コメントを追加