何らかの理由で、私のマテリアライズモーダルが本当に奇妙なレイアウトになっています。 私はCSSファイルに触れていないか、基本スタイルを全く変更していません。多分誰かが何が問題なのかを知っているかもしれない。モーダルのマテリアライズが正しく表示されない
私のモーダルは一部のdivの内部にありません。
マイ結果:それはちょうどボディ
$(document).ready(function() {
$('.modal').modal();
$('#modal1').on('click', function() {});
});
html,
body {
max-height: 100%;
min-height: 100%;
overflow-x: hidden;
}
body {
background-image: url("../img/kristallwelt.jpg");
-webkit-background-size: cover;
moz-background-size: cover;
-o-background-size: cover;
background-size: cover;
}
<!-- Modal Structure -->
<div id="modal1" class="modal modal-fixed-footer">
<div class="modal-content">
<h4>Modal Header</h4>
<p>A bunch of text</p>
</div>
<div class="modal-footer">
<a href="#!" class="modal-action modal-close waves-effect waves-green btn-flat ">Agree</a>
</div>
</div>
EDIT
私は解決策を得た後、私は参照に苦しんでいます。私はいくつかの偽の参照を持っている。この場合
:できるだけ早く私は、ボタンをクリックすると、私はこれを取得します。 誰かがここで問題を見ていますか? **本体の端部に含ま
<!DOCTYPE html>
<html>
<head>
<!-- JQuery -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<!-- JQuery UI -->
<link rel="stylesheet" href="https://ajax.googleapis.com/ajax/libs/jqueryui/1.12.1/themes/smoothness/jquery-ui.css">
<script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.12.1/jquery-ui.min.js"></script>
<!-- Bootstrap -->
<!-- Latest compiled and minified CSS -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<!-- jQuery library -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<!-- Latest compiled JavaScript -->
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
<!-- Font aswesome -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.css">
<!-- Materialize Logos -->
<link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
<!-- Include CSS -->
<link rel="stylesheet" type="text/css" href="../css/style.css">
</head>
</html>
ヘッダを含め
**
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/materialize/0.99.0/css/materialize.min.css">
<!-- Compiled and minified JavaScript -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/materialize/0.99.0/js/materialize.min.js"></script>
もこのコンソールエラーが関連する可能性が
エラー
あなたはjsfiddleを持っていますか?修正するのは簡単でしょう。 –
@Princesodhi申し訳ありません、今すぐ入手してください。緑色のdivの緑の丸いボタンはdivを開きます... https://jsfiddle.net/s2y272s3/#&togetherjs=Rf4mTbkNap – CallMeLeonardo