У меня есть диалоговое окно JQuery UI, которое автоматически открывается, когда пользователь заходит на мой сайт, поэтому мы можем показывать диалоговое окно «В разработке» модально.Вот код для диалога:
var $dialog = $('#dialog');
if ($.cookie("MySitePreviewCookie") != "firstView")
$(function () {
$.cookie("MySitePreviewCookie", "firstView", { expires: 180, path: '/' });
// Show Dialog Div
$dialog.dialog({
autoOpen: true,
resizable: false,
modal: true,
width: 600,
buttons: {
"Skip This": function () {
$(this).dialog("close");
}
}
});
});
else
$(function () {
// HIDE Dialog Div
$dialog.dialog({
autoOpen: false,
resizable: false,
modal: true,
width: 600,
buttons: {
"Skip This": function () {
$(this).dialog("close");
}
}
});
});
Вот разметка диалога:
<div id="dialog" title="Welcome to MySite" class="dialogStyles">
<p>
Our site is still under construction but please look around and get a feel for what
we plan to offer. If you would like to sign-up for our newsletter, please enter
your email address below and click the <strong>Sign-up for Newsletter</strong> button.
</p>
<p class="validateTips"></p>
<br />
<input type="text" id="ccEmailAddress" name="ccEmailAddress" class="required email"
style="width: 250px" />
<input id="btnAddNewsletter" class="submit" type="submit" value="Sign- up for Newsletter" />
</div>
Диалог отлично работает.У меня есть CSS для стилизации, и это выглядит великолепно, за исключением того факта, что при первой загрузке страницы есть куча изображений, которые она отображает за ней (домашняя страница).Он показывает (который расположен в самом низу страницы), а затем появляется диалоговое окно, и все в порядке.Как я могу заставить его перестать показывать DIV на странице и не влиять на диалог?