как использовать прокрутку с плагином simpleModal - PullRequest
Новая
       5

как использовать прокрутку с плагином simpleModal

4 голосов
/ 20 января 2011

Я использую плагин simpleModal http://www.ericmmartin.com/projects/simplemodal/ когда текст в диалоговом окне слишком длинный, я пытаюсь прокрутить, но прокручивается вся страница, даже если используется modal: true.

поэтому я не вижу конца диалога, я пытаюсь определить maxHeight - но, похоже, безрезультатно.

есть идеи?

код: 

 function loadDialog(Code,vrsnNum)
 {
  vrsnNum=vrsnNum-1;
  $.get(
   "/ajaxVerision.asp", 
   {Code: Code,VerisionNum: vrsnNum},
    function(data)
     {
     $(".CrnrPager").html(data);
     }
    );

  $.get(
   "/ajaxVerisionNext.asp", 
   {Code: Code,VerisionNum: vrsnNum},
    function(data)
      {
      $("#sp1").html(data);
      }
   );

  $('#basic-modal-content').modal({maxHeight: 400,autoPosition : true, position: ['20%','25%']});
 }

Ответы [ 2 ]

6 голосов
/ 20 января 2011

Вы можете попробовать назначить CSS для вызова modal(), например: 

$('#basic-modal-content').modal({
    maxHeight: 400,
    autoPosition: true,
    containerCss: {
        'maxHeight' : '400px',
        'overflow' : 'auto'
    },
    position: ['20%', '25%']
});

Кроме того, у вас также есть свойство dataCss.

2 голосов
/ 30 апреля 2015

Теперь довольно безопасно использовать calc в css, так что это то, что я делаю 

$('#confirmDialog').modal(
{
    dataCss: 
    {
          'maxHeight': 'calc(100vh - 10em)',   // spaces are needed
          'overflow': 'auto'
    }
 });

Это говорит о том, что нужно оставить как минимум 10em (5em с каждой стороны) над и под диалоговым окном.К счастью, даже если вы измените размер окна, все это будет хорошо отрегулировано.

Я использую функцию calc с 100vh - 10em, что означает получение высоты области просмотра и вычитание 1em.Вы не можете использовать 100% здесь, потому что это вложенный элемент.К сожалению, в iOS 100vh имеется пространство, которое скрыто панелью значков Safari, поэтому мне пришлось вычесть сумму 10em, чтобы она всегда была видимой.

Примечание: я использую dataCss, который добавляетАтрибуты стиля для содержимого, а не оболочки.Это означает, что если у вас есть граница, то она будет фиксированной, и содержимое будет красиво прокручиваться внутри нее.

Прочтите это для лучшего понимания vh на iOS: https://github.com/scottjehl/Device-Bugs/issues/36

...