Тъй като би било трудно да се включи цял код тук, има кратко описание на проблема (и някои изработени фрагменти по-късно): има този DIV елемент с дисплей, зададен на none, който изскача, като настрои дисплея да блокира (при някакво събитие onclick --- като меню). Тъй като съдържанието на този DIV е по-голямо от цялата страница, когато DIV.style.display == блокът, браузърът добавя вертикална лента за превъртане към своя прозорец --- и това е добре. Е, реших да задам max-height и overflow-y на този DIV, но ти DIV има хубава вертикална лента за превъртане сама по себе си (работи според очакванията), браузър --- конкретно IE11 --- все още добавя вертикално превъртане- лента към прозореца, както в предишния случай. Можете да го използвате, за да превъртите цялата страница, но без видима точка (просто няма съдържание в долната част на прозореца, до което да превъртите).
Ето как изглежда (горе или по-малко) в кода. Първо CSS:
div.mydiv {
display: none;
position: absolute;
border-width: 1px 0px 0px 0px;
border-color: #BBBBBB black black black;
border-style: solid solid solid solid;
border-radius: 0px 0px 5px 5px;
background-color: white;
padding: 4px;
line-height: 11px;
font-size: 10px;
font-weight: normal;
color: #FFFFFF;
opacity: 1;
left: -6px;
top: 12px;
cursor: default;
box-shadow: 1px 1px 3px #888888, -1px 1px 2px #EEEEEE;
z-index: 1600;
}
Сега HTML:
<div class="mydiv" style="overflow-y: scroll; max-height: 300px;">...</div>
Във FireFox работи както се очаква, т.е. DIV получава своята вертикална лента за превъртане, ако максималната височина на този DIV надвишава 300px и браузърът не добавя вертикална лента за превъртане към прозореца. В IE11 DIV също получава своята лента за превъртане, но също така и прозореца на браузъра (само ако DIV е видим, т.е. div.style.display == блок). Някакви идеи как да се отърва от поведението на този браузър?
АКТУАЛИЗАЦИЯ: ето цигулка, за да го демонстрирате, моля, обърнете внимание на вертикалната лента за превъртане в рамката с резултати, която се появява, когато списъкът е показано.
max-height: 100px
иoverflow-y: auto
задейства изпразнения (изобразен OK с преливащо или не съдържание) контейнер да бъде изобразен с много голяма височина. Поправено е с помощта наoverflow-y: scroll
. Обърнете внимание, че дъщерните елементи саdisplay: block
. - person Sergiu Paraschiv   schedule 10.07.2014