еще раз, IE оказывается самой большой болью в мире, на headset.no , у нас есть маленькое синее поле поиска, когда вы набираете, например, «jabra», оно должногенерировать div, который дает вам подсказки, это прекрасно работает в Chrome, Safari, Opera и FF, но, конечно, у IE есть другая идея, что с этим делать.
Я использую плагин Выбор браузера CSS для определения CSS между браузерами на этом сайте.
Когда я нажимаю F12 в IE, кажется, что есть ряд встроенныхстили, примененные к
<div class="autocomplete" id="searchSuggestions"
style="
z-index: 2;
position: absolute;
filter: ;
width: 130px;
display: none;
top: 193px;
left: 1px;"
getElementsByClassName="function() {...
, которых нет в исходном коде.
Может кто-нибудь взглянуть и попытаться сказать мне, что с этим не так?Я исчерпал все свое терпение по этому поводу.
JS:
var searchSuggestionInit = function()
{
if ($('searchField'))
{
$('searchField').addClassName('quickSearch');
$('searchField').down('.srch-txt').addClassName('text');
}
var field = $('searchContainer').down('.quickSearch').down('input.text');
if (!field.id)
{
field.id = 'searchQuery';
}
field.setAttribute('autocomplete', 'none');
new Ajax.Autocompleter(field.id, 'searchSuggestions', Router.createUrl('searchSuggestions', 'index'),
{
});
}
Event.observe(window, 'load', searchSuggestionInit);
И CSS:
/************************************************** SEARCH SUGGESTIONS*/
div.autocomplete {
position:absolute;
width:250px;
background-color:white;
border:1px solid #888;
margin:0;
padding:0;
z-index: 50000;
font-size: 0.85em;
overflow: hidden;
}
.ie .div.autocomplete {
position:absolute;
width:250px;
background-color:white;
border:1px solid #888;
margin:0;
padding:0;
z-index: 50000;
font-size: 0.85em;
overflow: hidden;
}
div.autocomplete ul {
list-style-type:none;
margin:0;
padding:0;
}
div.autocomplete ul li.selected { background-color: #ffb;}
div.autocomplete ul li {
list-style-type:none;
display:block;
margin:0;
padding:2px;
cursor:pointer;
white-space: nowrap;
}
И некоторый исходный код.
<div id="search" title="Søk automatisk i databasen">
<div id="searchField">
{capture assign="searchUrl"}{categoryUrl data=$category}{/capture}
{form action="controller=category" class="Search" handle=$form}
<input type="hidden" name="id" value="1" />
{textfield type="text" onblur="if(this.value=='') this.value='';" onfocus="if(this.value=='') this.value='';" class="srch-txt" name="q" id="s" size="16"}
</div>
<button type="submit" class="m" id="searchsubmit"> </button>{/form}
</div>
{loadJs form=true}
<div id="searchSuggestions" class="autocomplete" style="display: none;"></div>
{literal}
<script type="text/javascript">
$j("#search").tooltip({ offset: [45, 200], effect: 'slide' });
</script>
{/literal}
<div class="clear"></div>
</div>
</div>
Большое спасибо:)