2011 18 februar, 2011

IE Javascript Fejl: Objektet understøtter ikke denne egenskab eller metode

Havde dette mærkelige spørgsmål, hvor et stykke af Javascript virkede fint i alle browser ans som sædvanlig bar IE :) ... Simple det var, men da scriptet ikke var skrevet af mig, det tog lidt tid at fejlsøge dette "Objektet understøtter ikke denne egenskab eller metode" fejl, der kun IE var at kaste op. Sandsynligvis! Hvis jeg skulle skrive manuskriptet, ville jeg ikke have fået denne fejl overhovedet, som ikke blande mine variabelnavne med felt Ids :).

Problem: Objektet understøtter ikke denne egenskab eller metode (på linje 3)

function funzoneSP(){ document.getElementById('video_id').style.visibility="hidden"; shortdesc = document.getElementById('shortdesc').value; .... } 

Opløsning:
Fejlen er genereret på thirdrow i eksemplet ovenfor (Linje 3 ... "shortdesc = document.getE ...."). Jeg prøvede alle slags dumme ting, som I dont er endda værd nævne her, og til sidst gætte hvad! bare ændre shortdesc var til noget andet sluppet af fejlen. Dybest set! Variabelnavnet skulle forskellig fra fieldID


2009 November 7, 2009

CSS ZOOM - Endnu en IE særhed, den 3 pixel skift

Igen og igen, når alle de andre browsere set at opføre sig som fortalt af W3C regler, dvs spiraler dig ud af udviklingen ånd ved at kaste et raserianfald, betyder det ikke synes at have et fix. Bare sådan en, er dette problem i IE7.

Problem Statement:
Jeg og så kan mange af de andre alvorlige web-udviklere har bemærket mere end mange gange, at når der er indlejret flyder i layout, om svæver over nogle links (anker tags), den indeholder beholderen ser ud til at flytte nogle få pixels til højre . Jeg har forsøgt at google løsninger til dette problem, men har næppe fundet noget fornuftigt svar på hvorfor og hvornår det sker (som kan bidrage til at forhindre dette problem i at ske), derfor har jeg aldrig fundet en klar løsning på problemet enten ...

Mulig løsning:
Ud af erfaring, har jeg varsel 90% procent af de gange, dvs, at dette problem løses ved at tilføje en zoom ejendom i CSS definition af mis-opfører beholder ...

 # Somediv {
       zoom: 1;
 }

igen årsagerne er tvetydige ... prøv dette ...
Nogle elementer i IE har en "hasLayout" ejendom, der er "ægte" som standard. Mange visuelle CSS adfærd, for eksempel en a-filter virker kun på et element, der hasLayout. og {Zoom: 1} synes at give de udvalgte elementer hasLayout ejendom .... Nyttigt? Jeg tror ikke så ...

Zoom Ejendommen er tilsyneladende også understøttes af Chrome, men dens anvendelse fordybning synes at gøre meget negativ effekt på mit layout ... prøv det, hvis det virker for dig ... hvis det ikke gør, bogmærke denne side under "CSS craps"


2008 10 oktober 2008

IKKE til IE Only - CSS Child Selectors virker ikke i IE

CSS til ikke-IE browsere: Dens ingen nyheder at CSS udviklere, at CSS Børne Selectors som eksemplet nedenfor, ikke synes at virke i IE.

f.eks div> span {nogle css}, der betyder "når et span element er et barn (og ikke et barnebarn eller stor barnebarn osv.) af en division element".

Men vi brugte denne CON til vores fordel. Historisk set har barnet vælgeren blevet anvendt til at skjule CSS kommandoer fra IE. Simpelthen ved at placere html>body foran en CSS kommando IE vil ignorere det:

html>body .foo { CSS commands go here ;}

Det virker, fordi <body> altid er et barn af <html> - det kan naturligvis aldrig være et barnebarn eller oldebarn af <html> .

Nu hvor IE 7 forstår barnet selector, skal du indsætte en tom kommentar tag i umiddelbart efter større end tegnet IE 7 vil ikke forstå denne vælgeren (hvem ved hvorfor!?) Og vil derfor helt ignorere denne CSS kommando.:

html> /**/ body .foo { CSS commands go here ;}

Hvis der ikke allerede har set dem før, har læst gennem følgende samt


2008 4 Oktober 2008

Disappearing HTML / DIV elementer i Internet Explorer [IE]

Som sædvanlig. En af de mange nogle mærkelige problemer med IE, og det må man rangerer i top 10 i IE Quirks

PROBLEM ERKLÆRING (Dette var mit problem, måske du har lignende dårlig opførsel):
Jeg har mange DIV er på siden med klassen "sectionhead", der er intet, men titlen på en sektion på siden. Så jeg har nogle stil ser ud som denne

. Sectionhead {font-size: 18px; baggrund: # cfcfcf; padding: 5px;}

Det div er en lys grå bar med noget sort tekst. Hvad der sker i IE er nogle af disse sektionsoverskrifter vises ok, men nogle er usynlige, indtil du rulle siden eller klik noget på siden osv. Engang de har tendens til at forsvinde, når du klikker på 'alt', når du side ned eller rulle med scroll-bar. De tider synes at igen, når du genindlæse (F5) på siden. Jeg kort ganske enkelt DIV med nogle enkle stil opfører BAD.
Hvad kunne skabe en sådan en uberegnelig adfærd? Nå! Helt ærligt, NO IDEA!

MULIG LØSNING:
Igen spørg mig ikke hvorfor, men i mange tilfælde dette problem tendens til at forsvinde, når du tilføjer position: i forhold til mis opfører elementer stil, som dette

. Sectionhead {font-size: 18px; baggrund: # cfcfcf; padding: 5px; position: relative}

Weird, men hvad jeg skal sige? Gud velsigne mig fra IE!

OG deler med USA, hvis du havde lignende problemer.


2008 15 juli 2008

IE 8 streng mode og CSS uigennemsigtighed ... Arbejde Around

Nå ja! I tidligere indlæg et par dage tilbage for Opacitet i IE8, jeg glemte at nævne et vigtigt punkt, at "IE 8 streng tilstand ikke giver mulighed for CSS uigennemsigtighed".
For dem, der donot forstår, hvad jeg mener med streng tilstand, her er hurtig tutorial .

Et værk omkring dette (Før IE dev team indse, at de har banet vejen for re-arbejdsrutiner over hele verden, for web-sites bruger pop-up lightboxer med nogle opacitet, og sat tilbage støtte til opacitet) er at bruge en semi gennemsigtigt billede ... helst i PNG-format (jeg har haft dårlig oplevelse at få gennemsigtige GIF-billeder til at arbejde som de skulle). Opret en PNG billede af farven og procentdelen af ​​gennemsigtighed du kan lide, i jer foretrukne billedredigeringsprogram og bruge det som baggrundsbillede til din lightbox overlay.

dvs
I stedet for at noget som dette

. Lighbox_overlay {
background-color: # ffffff;
z-index: 1001;
-Moz-opacity: 0,6;
opacitet: 0,60;
filter: alpha (opacity = 60);
}

Gør dette ....

. Lighbox_overlay {
baggrund: url (bkg.png) repeat;
}

At prøve det, KLIK HER! | AT DOWNLOADE, KLIK HER!


2008 20 juni 2008

White Space Bug i Line / List Items (li) i IE6

Hvis du nogensinde har gjort (eller lave en) en vertikal menu ved hjælp af listeelementer (Li) tags og CSS, kan du støde på, er dette endnu en fejl i Internet Explorer, hvor IE 6 indsætter disse huller mellem listeelementer, der indeholder blok niveau elementer, dvs hvis der er nogen mellemrum mellem listeelementerne i opmærkningen. Tak, men nej tak, den IE version 7 synes fri fra denne fejl.
Hvis ligesom mig, og mange flere, du tilhører denne gruppe af frustrerede udviklere, der stadig har til at få deres nye layouts, der arbejder i IE6, så det kan vise sig nyttige. Tag et kig ...

Sample markup:

<ul id="menu">
<li> <a href="#"> Forside </ a> </ li>
<li> <a href="#"> Om </ a> </ li>
<li> <a href="#"> Services </ a> </ li>
<li> <a href="#"> portefølje </ a> </ li>
<li> <a href="#"> Ofte stillede spørgsmål </ a> </ li>
<li> <a href="#"> Kontakt os </ a> </ li>
</ Ul>

Du kan skabe nogle CSS, svarende til en nedenfor, for at transfrom ovenstående markup ind i en lodret menu ....

Sample CSS ...
# Menu {
margin: 0; padding: 0; baggrund: # FF9900;
list-style-type: none; bredde: 150px;
}
# Menu li {margin: 0; padding: 0;}
# Menu a {display: block;
color: # 555555;
text-decoration: none;
padding: 0 15px;
line-height: 2,5; border-bottom: 1px solid # FFF;
}

De resultater, du vil se ...
null

Løsning for denne fejl ... (ændret / tilføjet CSS med fed kursiv)

# Menu {
margin: 0; padding: 0; baggrund: # FF9900; list-style-type: none; bredde: 150px;
float: venstre; / * denne indeholder svævede listeelementer * /
}
# Menu li {
margin: 0; padding: 0;
float: venstre; / * dette løser * /
Bredde: 100%; / * whitespace fejl i IE6 * /
}
# Menu a {
display: block; color: # 555555;
text-decoration: none;
padding: 0 15px;
line-height: 2,5; border-bottom: 1px solid # FFF;
}

Hvis ovenstående løsning doesnot synes at arbejde (på grund kendt for at IE6 kun) ... prøv denne metode i stedet for

Du skal blot tilføje denne ekstra IE6 kun stilarter til din markup ...

<-! [If lt IE 7>
<style type="text/css">
# Menu li a {display: inline-block;}
# Menu li a {display: block;}
</ Style>
<[Endif] ->


2008 12 April 2008

CSS Cross Browser Mindste Højde Hack

Indlæg IE 6, har MSIE været så venlig at os UI udviklere ved at tilføje nogle flere CSS egenskaber standard til de fleste andre standard browsere. En sådan nyttig egenskab i "min-højde". Temmelig ligetil ejendom, som ikke behøver lange forpustet forklaring. Når en min-højde for en afdeling er indstillet, er det altid bevarer det sæt højde, når det indhold, husene optager mindre end den kan rumme og vigtigere (i modsætning til plain vanilla "højden" ejendom) skalaer eller i CSS ord, den opfører sig som en spaltningen, hvis "højde" er sat til "auto" ...

For nogle af os fattige udviklere, der stadig er forpligtet til at kode, CSS, som også skal arbejde i IE6, kan un-tilgængeligheden af "min-height", vise et show prop engang ... donot fortvivlelse.

Heldigvis har vi nok særheder i IE, at vi ville bruge til at ud fordel og hacke vores vej igennem for at nå vores mål ... nemlig at gøre en division division, som om den min-højde i IE6

Løsning 1: Ved hjælp af understregning Hack [ ... Læs mere ]

.box1 {
min-height: 200px;
height:auto;
_height:200px;
}

HTML: -
<div class="box1">Some dynamic content with variable height ...</div>


Løsning 2: Brug af CSS attribut Selector Hack

.box2 {
min-height:200px;
height:200px;
}
div[class] .box2 {
height:auto;
}

HTML: -
<div class="someclass">
<div class="box2 common">Some dynamic content with variable height ...</div>
</div>

CSS attribut Selector Hack drager fordel af det faktum, de browsere tidligere THA IE6 ignoreret en atribute-vælgeren. Bemærk kravet om en anden beholder division med class = "someclass". Bare presense i klassen attributten for denne opdeling, tilsidesætter højden tilbage til Auto, for Opera, Mozilla og MSIE7 og senere. IE6, som ikke understøtter atribute vælgere, ignorerer det.

Se demo af min højde hack for IE6



2008 15 marts 2008

Irriterende Vælg Boxes synlige gennem Popup divisioner

Ved flere lejligheder, osv., mens laver sidelayout med popup afdelinger / lightboxer / Tips, vi kommer på tværs af situationer, hvor nogle Form Markere objekter sker for at være under disse POPUP divisioner, ved design, og det skinner igennem .... YUK!

Nå! du kan nemt løse dette ved at justere dine Z-indeksværdier passende til FF og IE7. Men den gode gamle (pun intended) IE6 ikke opfører sig efter hensigten .... SELECT BOX showet igennem, selv når du anvender nogle drastisk høj Z-indeksværdier til din popup Division ... Øv!!

Der er INGEN rettelser til dette problem, men der er, tror jeg, mere end et par måde at arbejde-around dette problem, men Im her for at fortælle dig den enkleste løsning, som jeg bruger, som virker fint for mig, i de fleste af de sager ....

"Skjul ROUGE SELECT felt, når du viser POPUP"

Blot i dit script kodestykke hvor du viser din popup, tilføje et stykke script til at indstille synligheden af ​​SELECT Box til "Hidden"

document.getElementById ('my_select') style.visibilty = "skjult".

Og husk at sætte det tilbage ved lukning af din popup Division

. document.getElementById ('my_select') style.visibilty = "synlig";

hvor "my_select" er ID'et for den irritation SELECT Box

Håber dette hjælper ...

PS. Der er ofcourse andre muligheder som dynamisk positionining en IFRAME (samme størrelse som du PopUp) under popup DIV ... Dette virker også godt, men med en tilføjelse af masser af DOM-elementer, scripts og hovedpine. Jeg har brugt denne løsning også, og hvis du har brug for hjælp med denne indstilling, lad mig det vide. Vil være glad for at hjælpe!


2008 Januar 8, 2008

Betingede Bemærkninger: For din IES Kun-Part Duex

Et par måneder tidligere vi så, hvordan vi kunne omfatte et stykke CSS, der ville være synlig for IE6 kun ( For din IES kun ). Der er andre måder at opnå dette. Du skal blot indeholde en separat CSS, der er specifikke for dit mål IE. dette kan opnås med det, er indkaldt som Betingede kommentarer.

Betingede Kommentarer er en måde at opdage browser type og version. Browser detektering udføres for at sikre, at indholdet præsenteres for browseren specifikke. Browseren detektion kan udføres ved hjælp af mange forskellige teknikker. Denne fremgangsmåde har adskillige fordele i forhold til tidligere metoder, der indeholdt stil switching hjælp af JavaScript. Til oversigt vigtigt få, ville være;

  • Scripting kræves ikke
  • Cross-browser

Hvordan gør vi det?

Gør noget i IE 5 kun
<!--[if IE 5]> Welcome to Internet Explorer 5. <![endif]-->

Gør noget i alle IE-versioner
<!--[if IE]>
<link href="css/ie.css" rel="Stylesheet" type="text/css" />
<![endif]-->

Gør noget i alle IE-versioner nyere, at IE 5
<!--[if gte IE 5]>
<script type="text/javascript"><!--
alert("Congratulations! You are running Internet Explorer 5 or greater.");<br />
// --></script>
<![endif]-->

For flere betingede vartiations, læse denne info på MSDN:
Om Betinget Kommentar


2007 15 september 2007

Hvad er DOCTYPES? Hvad er BROWSER Quirks & Streng tilstand?

Enkel speaking (for dem, der aldrig har hørt om doctype før i dag)! DOCTYPE er erklæringen i et HTML-dokument, der kommer før <HTML> tag, der ser noget som dette (indsat fra kilden til denne meget side)

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">


Hvorfor bruge DOCTYPE?
Det hele begyndte, da browser-standarder blev indført af W3C. De tidligere webudviklere implementeret CSS ifølge ønsker browsere, for at få siderne gengives korrekt i dem, og de fleste hjemmesider havde CSS, der ikke helt matcher disse specifikationer / standarder.

Derfor løsning på dette problem var at

  • give web-udviklere, der kendte deres standarder at vælge hvilken tilstand til at bruge.
  • fortsætte med at vise gamle sider i henhold til de gamle (særheder) regler.

Og DOCTYPE blev født.

Så baseret på, om din side er designet til standarder eller ej, kan du vælge den relevante doctype.


Forholdet mellem DOCTYPE & Browser tilstande
DOCTYPE er den erklæring, der fortæller browseren hvilken tilstand den skal gøre HTML-side i eller snarere at være mere præcis, hvordan skal browseren fortolke CSS i, Quirks Mode eller Streng tilstand.

Gamle sider skrevet før disse standarder blev indført ikke har en doctype. Derfor, når der ikke er nogen DOCTYPE i din HTML så browseren er i Quirks tilstand.
Men hvis DOCTYPE er defineret som en af de følgende, derefter browseren siges at være strengt tilstand.

<DOCTYPE html PUBLIC "- / / W3C / / DTD HTML 4.01 Transitional / / EN" "http://www.w3.org/TR/html4/loose.dtd">


NDK hjem | Udtrykke IT | udtrykke Smag | udtrykke Penmenship | udtrykke Awe | udtrykke mig