jQuery: проблема с элементами управления в окне IE6

У меня есть веб-страница, содержащая поле выбора. Когда я открываю диалог jQuery, он отображается частично позади окна выбора.jQuery: проблема с элементами управления в окне IE6

Как мне подойти к этой проблеме? Должен ли я скрывать поле выбора или jQuery предлагает какое-то «прокладку». (Я Googled, но не нашли ничего)

Вот код:

<!DOCTYPE html> 
<html lang="en"> 
<head> 
<title>testJQuery</title> 
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1"> 
<meta name="GENERATOR" content="Rational Application Developer"> 

     <link rel="stylesheet" href="theme/smooth/theme.css" type="text/css" media="screen" /> 
</head> 
<body> 

    <a class="pop" href="nix">Click me</a> 

    <p/> 

    <select size="20"> 
     <option>s jl fjlkdjfldjf l*s ldkjsdlfkjsdl fkdjlfks dfldkfjdfkjlsdkf jdksdjf sd</option> 
     <option>s jl fjlkdjfldjf l*s ldkjsdlfkjsdl fkdjlfks dfldkfjdfkjlsdkf jdksdjf sd</option> 
     <option>s jl fjlkdjfldjf l*s ldkjsdlfkjsdl fkdjlfks dfldkfjdfkjlsdkf jdksdjf sd</option> 
     <option>s jl fjlkdjfldjf l*s ldkjsdlfkjsdl fkdjlfks dfldkfjdfkjlsdkf jdksdjf sd</option> 
     <option>s jl fjlkdjfldjf l*s ldkjsdlfkjsdl fkdjlfks dfldkfjdfkjlsdkf jdksdjf sd</option> 
    </select> 

    <div id="xyz" class="flora hiddenAsset"> 
     <div id="dialog" title="Edit Link"> 
      <p>Enter the link details:</p> 
      <table width="80%" border="1"> 
       <tr><td>URL</td><td><input id="url" style="width:100%" maxlength="200" value="{url}"/></td></tr> 
       <tr><td>Title</td><td><input id="title" style="width:100%" maxlength="200" value="{title}"/></td></tr> 
       <tr><td>Target</td><td><input id="target" size="20" maxlength="200" value="{target}"/></td></tr> 
      </table> 
     </div> 
    </div> 

<script type="text/javascript" src="../script/firebug/firebug.js"></script> 
<script type="text/javascript" src="jquery-1.2.6.js"></script> 
<script type="text/javascript" src="jquery-ui-1.5.2.js"></script> 
<script type="text/javascript" src="jqSOAPClient.js"></script> 
<script type="text/javascript"> 
(function($){ 
    $(document).ready(function(){ 
     console.debug('ready'); 
     $('.hiddenAsset').hide(); 

     $('a.pop').bind('click', showDialog); 
     console.debug('ready - done'); 
    }); 

    var showDialog = function(){ 
     console.debug('show'); 
     $('#dialog').dialog({ 
      modal: true, 
      overlay: { 
       backgroundColor: '#666', 
       opacity: '.3', 
       filter: 'alpha(opacity=30)' 
      }, 
      width: '400px', 
      height: '300px', 
      buttons: { 
       Ok: function() { 
        $(this).dialog('close'); 
       }, 
       Cancel: function() { 
        $(this).dialog('close'); 
       } 
      } 
     }); 
     console.debug('show-done'); 
     return false; 
    }; 
})(jQuery); 
</script> 
</body> 
</html>

источник

2008-10-06 paul

Это не имеет ничего общего с JQuery, в частности. Это известная ошибка в IE 6. Окна выбора на основе Windows всегда отображаются поверх других элементов. Единственное, что вы можете сделать, это скрыть поля выбора, когда они закрыты, - обычно заменяя их тем, что выглядит как поле выбора.

источник

2008-10-06 11:09:29 Neall

Да, я понимаю это. Я использовал mootools и ui framework из cnet. Каркас ui сделал что-то с iframe когда диалог был открыт. iframe подавил поля выбора. – paul 2008-10-06 11:19:10

В конце концов я нашел плагин, который помогает - bgiframe Странно, что он доступен в качестве плагина. Почему он не интегрирован в основной интерфейс?

Пробовал, но, к сожалению, он закручивает мой диалог! Содержимое диалогового окна смещено слева на 30-40 пикселей :-(Следующая проблема ...

источник

2008-10-06 14:17:01 paul

jQuery: проблема с элементами управления в окне IE6

ответ

Смежные вопросы