JQuery UI диалог: как инициализировать без строки заголовка?

Question

Можно ли открыть диалоговое окно jQuery UI без строки заголовка?

Answer 1

Вы можете использовать jquery, чтобы скрыть заголовок заголовка после использования dialogClass при инициализации диалога.

во время инициализации:

$('.selector').dialog({
    dialogClass: 'yourclassname'
});

$('.yourclassname div.ui-dialog-titlebar').hide();

При использовании этого метода вам не нужно менять файл CSS, и это тоже динамично.

Answer 2

Это самый простой способ сделать это, и он удалит заголовок только в этом конкретном диалоге;

$('.dialog_selector').find('.ui-dialog-titlebar').hide();

Answer 3

Единственное, что я обнаружил, когда скрывал заголовок диалогового окна Dialog, это то, что, даже если display отсутствует, программы чтения с экрана все равно поднимают его и будут читать. Если вы уже добавили свою собственную строку заголовка, она будет читать оба, вызывая путаницу.

То, что я сделал, было удалено из DOM с помощью $(selector).remove(). Теперь программы чтения с экрана (и все остальные) не увидят его, потому что он больше не существует.

Answer 4

Попробуйте это

$("#ui-dialog-title-divid").parent().hide();

заменить divid на соответствующий id

Answer 5

Эта следующая форма устранила мне проблему.

$('#btnShow').click(function() {
  $("#basicModal").dialog({
    modal: true,
    height: 300,
    width: 400,
    create: function() {
      $(".ui-dialog").find(".ui-dialog-titlebar").css({
        'background-image': 'none',
        'background-color': 'white',
        'border': 'none'
      });
    }
  });
});

#basicModal {
  display: none;
}

<script src="http://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.10.3/jquery-ui.min.js"></script>
<link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.10.3/themes/smoothness/jquery-ui.css" />
<div id="basicModal">
  Here your HTML content
</div>
<button id="btnShow">Show me!</button>

Answer 6

Вот как это можно сделать.

Перейти в папку тем -> base -> open jquery.ui.dialog.css

Найти

Подписок

если вы не хотите отображать titleBar, просто установите display: none, как я сделал в следующем.

.ui dialog.ui-dialog .ui-dialog-titlebar 
{
    padding: .4em 1em;
    position: relative;
        display:none;
}

Самиларлы за звание тоже.

.ui-dialog .ui-dialog-title {
    float: left;
    margin: .1em 0;
    white-space: nowrap;
    width: 90%;
    overflow: hidden;
    text-overflow: ellipsis;
    display:none; 
}

Теперь приходит кнопка закрытия, вы также можете установить ее нет или вы можете установить ее

.ui-dialog .ui-dialog-titlebar-close {
    position: absolute;
    right: .3em;
    top: 50%;
    width: 21px;
    margin: -10px 0 0 0;
    padding: 1px;
    height: 20px;

   display:none;

}

Я много занимался поиском, но потом ничего не подумал. Однако это приведет к тому, что у всего приложения не будет кнопки закрытия, строки заголовка для диалога, но вы также можете преодолеть это, используя jquery, добавляя и устанавливая css через jquery

вот синтаксис для этого

$(".specificclass").css({display:normal})

Answer 7

Это помогло мне скрыть строку заголовка диалогового окна:

$(".ui-dialog-titlebar" ).css("display", "none" );

Answer 8

Я думаю, что самый простой способ сделать это - создать новый виджет myDialog, состоящий из виджета диалога без минус штрих-кода. Удалять штрих-код заголовка выглядит просто.

https://github.com/jquery/jquery-ui/blob/master/ui/jquery.ui.dialog.js

Answer 9

Для меня я все еще хотел использовать изменяемые углы, просто не хотел видеть диагональные линии. Я использовал

$(".ui-resizable-handle").css("opacity","0");

Просто понял, что я комментирую не тот вопрос. Жизнь до моего тезки: (

Answer 10

зайдите в ваш jquery-ui.js (в моем случае jquery-ui-1.10.3.custom.js) и найдите this._createTitlebar (); и прокомментируйте это.

теперь любой ваш диалог появится с заголовками. Если вы хотите настроить заголовок, просто перейдите к _createTitlebar (); и отредактируйте код внутри.

от