Te drukken

Is het je opgevallen soms, hoe eenvoudig dingen gewoon weigert om te werken in IE6 ... location.href is zo'n ding.

Als u hebt toegevoegd een onclick functie om uw anker tag zoals hieronder ...

<a href="javascript:void(0);" onclick="onClickLink('xxx');"> ga naar nieuwe locatie </ a>

Bij sommige functies zo ...
functie onclickLink (id) {
var uri = "test2.html id =?" + id;
window.location.href = URI;
}

Om uw ironie, zou u merken dat een dergelijk stuk eenvoudig script weigert om te werken in IE ... Nou! Ik kan redenen hier te bespreken, maar niet dat het de moeite waard zijn ... Hoewel, ik heb blijkbaar een oplossing te hebben ... (ik wed dat als je begrijpt Javascript, zult u begrijpen, waarom voegen we deze tweak voor IE6)

De oplossing

<a href="javascript:void(0);" onclick="onClickLink('xxx'); terugkeer false; "> ga naar nieuwe locatie </ a>

Als u een eenvoudige antwoorden, doe dan een opmerking plaatsen. Het zal echt appretiated, Ik durf te wedden, door velen!

Als u hebt opgesteld, CSS voor de tijd, zou je ervaring hebt die momenten waarop je letterlijk trek je haar wanneer uw CSS-lay-outs zag er prima in alle nieuwe browsers (ik bedoel browsers later dan IE6), maar IE 6 gooit een driftbui. Je vechten hard om uw CSS aan te passen, maar het werkt niet ... Nou! Probeer deze hacks ...

1. Underscore Hack: -
Per definitie, CSS 2.1-specificatie kan underscore ("_") in CSS id's. Maar veel browsers lijken nog steeds op een identificeert ging met een underscore te negeren, maar IE. Deze IE bug / feature wordt dus een heel duidelijke manier om de CSS-eigenschappen alleen voor IE. dus denk eraan, een CSS-eigenschap geschreven met de underscore op het begin zichtbaar is voor Internet Explorer (alle versies, maar IE 7)

#box {
min-height: 300px;
height: auto;
_height: 300px; /* all IE versions less than version 7 */
...
}

Bekijk de demonstratie van deze underscore hack

Ook de min-height hack voor IE6 de underscore hack gebruikt, check out

2. Hekje (#) Hack: -
Net als de underscore hack, deze ook is, is voor IE oly, met een goed verschil, eigendom id voorafgegaan door # op het begin is zichtbaar voor alle IE-versies, IE7 inbegrepen en is onzichtbaar voor elke andere standaard browser.

.obj_container {
display: table-cell;
vertical-align: middle;
#position: absolute; /* For IE only */
#top: 50%; /* For IE only */
#left:50%; /* For IE only */
}

Deze hack mooi is gebruikt om een cross browser verticale lijnen oplossing aan te tonen, eens een kijkje op dit artikel om ons meer te vinden

3. CSS voor IE6 alleen: -
#my_bad_behaving_div {
/*something for all browsers*/
}
/* Lets use the * html hack so only IE6 reads the rule */
* html #my_bad_behaving_div{
/*something for IE6 only*/
}

Deze hacks lijkt de hemel gezonden, als niets anders werkt ... Als een van deze hacks redt je leven op een dag, vergeet niet om me te trakteren op een koffie :)

Ik had dit probleem, waar, als je een mouseover gebeurtenis op een divisie (DIV) en die afdeling, voor een aantal goede redenen had om transparant te zijn (zoals in mijn geval, waar het nodig was om een ​​aantal labels weer te geven op een plaatje de muis overheen gegaan van deze transparante divisie), IE niet aan de mouseover gebeurtenis (werkte prima in FireFox) te activeren.

Geprobeerd verschillende opties ... veel van die net een wanhopige poging om het evenement te krijgen om te vuren in IE. Een van de verstandige degenen, dat ik dacht dat zou kunnen werken was om een ​​achtergrond kleur in te stellen voor de divisie en de dekking op nul gezet ... Nou! dint werk!

De uiteindelijke oplossing die leek te werken en niet verstoren de functionaliteit die ik verplicht was om een een pixel zet herhaald / transparante achtergrond afbeelding in die afdeling

... Silly! maar nu IE lijkt gelukkig.

Eenvoudig ... Om dit probleem op gebruikt, worden te corrigeren: inline.

div {float:left;margin:40px;display:inline;}

Als u een zwevend element zoals een div en het plaatsen van margin-right of margin-left op dat element, zal Internet Explorer 6.0 verdubbeling van die marge waarde, verpesten de html / css lay-out. Om dit op te lossen, voeg dan gewoonweg display: inline; om uw drijvend element.