/ Forside/ Teknologi / Udvikling / HTML / Spørgsmål
Login
Glemt dit kodeord?
Brugernavn

Kodeord


Reklame
Top 10 brugere
HTML
#NavnPoint
molokyle 11184
Klaudi 5506
bentjuul 3377
severino 2040
smorch 1950
strarup 1525
natmaden 1396
scootergr.. 1320
e.c 1150
10  miritdk 1110
PNG format driller
Fra : Marchwitz
Vist : 855 gange
200 point
Dato : 15-11-06 23:35

På min testside www.nyuu.dk kan man se mit problem.
Der ligger 7 billeder hvoraf det ene er et gif og de andre er PNG.
Af de 6 png billeder virker de 3 fint, men de andre 3 har af en eller anden mærkelig årsag ikke transparent baggrund, er der nogen der kan give mig et vink til hvorfor det mon er sådan? Hvad har jeg overset?
Alle billederne burde efter min bedste overbevisning være med transparent baggrund, det var de i hvert fald der hvor jeg fandt dem



 
 
Kommentar
Fra : peque


Dato : 15-11-06 23:41

Så vidt jeg husker, har jeg været ude for det problem før - jeg ser det igennem Firefox og der virker det fint - som det nu er meningen det skal.

Jeg kan ikke huske hvad det - desværre - der er jeg lige helt blank lige pt.

Kommentar
Fra : Marchwitz


Dato : 15-11-06 23:46

Ja jeg har godt lagt mærke til at det virker fint i Firefox, men ikke i Explorer eller Avant.
Det gør det næsten endnu mere mærkeligt, Ik'?

Kommentar
Fra : miritdk


Dato : 15-11-06 23:47

har du et grafikprogram hvor du kan fjerne baggrunden ???

Kommentar
Fra : peque


Dato : 15-11-06 23:52

Jamen generelt ville jeg bruge et program som photoshop,eller fireworks og lign. til at åbne det og derfra tjekke baggrunden og derefter fjerne den hvis den er der.
Og derefter prøve at sætte den ind igen og se. Tror nu mere det er explorer der ikke rammer standarterne(mener jeg det er)

Kommentar
Fra : miritdk


Dato : 15-11-06 23:54

hvis du kan forandre og fjerne baggrund så gem dem som gif i stedet for png - når du har fjernet baggrunden



Kommentar
Fra : Marchwitz


Dato : 15-11-06 23:57

Ja vi bruger Photoshop til den slags, men det viser at baggrunden allerede er transparent og fuldstændig ren, selv i det store billede med damen som ellers ser lidt grå ud.

Kommentar
Fra : Marchwitz


Dato : 15-11-06 23:58

Men som gif fylder de jo en del mere, og det drejer sig om ca 700 forskellige billeder ialt

Kommentar
Fra : miritdk


Dato : 16-11-06 00:01

det er kun png formaterne ikke ???

Kommentar
Fra : Marchwitz


Dato : 16-11-06 00:05

Jo det er kun png formaterne, men ikke alle, og ikke når man ser siden i Firefox f.eks.

Kommentar
Fra : miritdk


Dato : 16-11-06 00:06

kig lige i dine private beskeder

Kommentar
Fra : miritdk


Dato : 16-11-06 00:19

hmm - hvis det er animationer skal de helst være i gif og gemmes i gif - prøv at sende dem til mig som du har hentet dem

Kommentar
Fra : Marchwitz


Dato : 16-11-06 00:28

Nu har jeg uploadet det store billede i gif format, og det virker fint.
Det er kun den ene type billede der er annimeret og de er naturligvis i gif format i forvejen, alle de andre er bare ganske almindelige billeder i png format, men de kan åbenbart give problemer at få vist korrekt.
Hvis jeg er nød til at lave dem om til gif, skal jeg igen med 7-800 af den slags billder.
Jeg håber stadig der findes en metode så jeg kan lade dem blive i png formatet

Accepteret svar
Fra : bentjuul

Modtaget 210 point
Dato : 16-11-06 00:30

Jeg mener ikke at IE 6.0 understøtter png ordentligt, men det gør IE 7.0 prøv at læs her http://www.microsoft.com/danmark/windows/ie/ie7/downloads/checklists.mspx under punktet Udviklere og Webudviklere.

se desuden dette
Citat
Lidt bedre kan det beskrives i forbindelse med den komplikation PNG og Internet Explorer har. PNG har som sagt mulighed for 8 bit (2^8=256) transperante farver, og dette fungerer fint med f.eks. Mozilla Firefox browseren, men i IE 6 og 5.5 virker det i midlertid ikke endnu (MS siger at fejlen er rettet i IE 7). Se nu disse to billeder:


Citatet er herfra http://www.udvikleren.dk/Design/Article.aspx/280/

//bentjuul

Kommentar
Fra : Marchwitz


Dato : 16-11-06 00:34

Nu vil jeg gå i seng og drømme om genstridige png filer, måske har nogen fundet et svar på hvorfor png billederne skal give problemer når jeg engang kommer online igen, forløbig tak for hjælpen og sov godt til alle

Kommentar
Fra : miritdk


Dato : 16-11-06 00:37

understøtter siden i det hele taget png ????

Kommentar
Fra : bentjuul


Dato : 16-11-06 00:40

Her er en kode fra mit seneste link der skulle kunne klare at vise PNG ordentligt i Internet Explore

Kode
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
   <title>Nyt dokument</title>
<meta name="generator" content="TSW WebCoder">
<style type="text/css">
      body
      {
         background-color: #006633;
      }

      #test
      {
         width:200px;
         height:200px;
         margin: 0;
         filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='PNG-IE.png',sizingMethod='scale');
      }

      html>body #test
      {
         background: url(PNG-IE.png);
      }
</style>
</head>

<body>
<div id="test"></div>
</body>
</html>


Det står beskrevet under PNG.

//bentjuul

Kommentar
Fra : bentjuul


Dato : 16-11-06 02:15

Her er et link mere til løsning af dit problem - hvor koden til png også er beskrevet http://www.tips-og-tricks.com/tippet/Vis_transparent_png_i_Explorer

//bentjuul

Kommentar
Fra : molokyle


Dato : 16-11-06 10:08

Jeg bruger IE7 og alle billederne vises korrekt hos mig

..det gør de iøvrigt også i Firefox, Opera og Netscape (..både i IE og Firefox rendering), men i disse browsere undtagen Netscape i IE renderingsmode, virker din CSS kode ikke:
Kode
body {
background: #000000 url("bag.JPG") no-repeat scroll top 100px;
font: normal verdana serif;
color: #999900;
empty-cells: hide;
text-align: center;
text-decoration: none;
h1 font-size: 100px;
h2 font-size: 40px;
h3 font-size: 30px;
h4 font-size: 20px;
p font-size: 10px;
}

#boks1
   {position:absolute; top: 30px; left: 300; width: 600px;}
#boks2
   {position:absolute; top: 170px; left: 120px; width: 70px;}
#boks3
   {position:absolute; top: 280px; left: 120px; width: 70px;}
#boks4
   {position:absolute; top: 400px;   left: 120px; width: 70px;}
#boks5
   {position:absolute; top: 550px;   left: 120px; width: 70px;}
#boks6
   {position:absolute; top: 180px;   left: 220px; width: 190px;}
#boks7
   {position:absolute; top: 250px;   left: 310px; width: 100px;}
#boks8
   {position:absolute; top: 750px;   left: 310px; width: 100px;}

#boks20
   {position:absolute; top: 900px;   left: 220px; width: 420px;}


Det er måske fordi jeg mangler nogle plug-in ?

..men nok snarere pga. de mange fejl i koden:
Kode
Errors
URI : http://www.nyuu.dk/poketest.css

Line: 2 Context : body
Invalid number : background Too many values or values are not recognized : #000000 url("bag.JPG") no-repeat scroll top 100px

Line: 3 Context : body
Invalid number : font verdana is not a font-size value : normal verdana serif

Line: 9 Context : body
Parse Error - font-size: 100px

Line: 10 Context : body
Parse Error - font-size: 40px

Line: 11 Context : body
Parse Error - font-size: 30px

Line: 12 Context : body
Parse Error - font-size: 20px

Line: 13 Context : body
Parse Error - font-size: 10px

Line: 20 Context : #boks1
Invalid number : left only 0 can be a length. You must put an unit after your number : 300


scroll er ikke en 'normal' CSS værdi (Det er en IE 'ting').

Font typer skal angives med egenskaben font-family:... og der skal komma mellem parametrene.
Eks.:
Kode
body {font-family: arial, tahoma, verdana, sans-serif;}


</MOLOKYLE>

Kommentar
Fra : molokyle


Dato : 16-11-06 10:15

Ps. Du kan heller ikke 'plante f.eks. en h1 i en body:
Kode
body {
.
.
h1 font-size: 100px;
.
osv.
}


Du skal sætte de forskellige markører med fælles egenskaber udenfor, for at opnå dette:
Eks.:
Kode
body h1 { font-size: 100px; }


</MOLOKYLE>

Kommentar
Fra : Marchwitz


Dato : 16-11-06 22:00

Til Molokyle:
Tak for dine tips til at rette min css. Der er mange muligheder for fejl når man roder sig ud i sådan noget

Til alle:
Det virker som noget vanskeligt noget at bruge png format når man samtidig vil være helt sikker på at alle kan se billedet som man havde tænkt sig.
Kunne godt se ud til at jeg skal igang med at ændre alle billederne til gif formatet.
Men lad os lige se om der skulle dukke et super forslag op.
Jeg synes ikke så godt om at skulle skrive speciel kode til hvert enkelt billede, så næsten hellere undgå png

Kommentar
Fra : bentjuul


Dato : 16-11-06 22:27

Du kan da kode dig ud af det med CSS det viser det eksempel jeg lagde kl. 00.40, men OK hvis du syntes det er nemmere at lave billederne om

//bentjuul

Kommentar
Fra : molokyle


Dato : 17-11-06 08:51

Ja, du kan bruge bentjuuls løsning, men for at andre browsere ikke skal 'brække sig' over denne specifikke Microsoft kode bør du udmaske den med betingelseskommentarer:

Kode
<!--[if lt IE 7]>
<link rel="stylesheet" type="text/css" href="iehacks.css" />
<![endif]-->


IE CSS hacks skaber problemer for IE 7. Læs her hvorledes de forskellige hacks til tidligere versioner af IE stadig kan benyttes, samtidig med at siderne kan læses af IE 7 :

http://www.positioniseverything.net/articles/ie7-dehacker.html

</MOLOKYLE>

Godkendelse af svar
Fra : Marchwitz


Dato : 18-11-06 16:02

Tak for hjælpen til alle og tak for løsningen bentjuul

Jeg er i hvert fald blevet en hel del klogere, og samtidig mere opmærksom på at gøre kodningen så enkel og entydig som overhovedet mulig så alle kan komme til at se websiderne på den måde jeg havde tænkt mig de skulle se ud.



Du har følgende muligheder
Eftersom du ikke er logget ind i systemet, kan du ikke skrive et indlæg til dette spørgsmål.

Hvis du ikke allerede er registreret, kan du gratis blive medlem, ved at trykke på "Bliv medlem" ude i menuen.
Søg
Reklame
Statistik
Spørgsmål : 177577
Tips : 31968
Nyheder : 719565
Indlæg : 6409071
Brugere : 218888

Månedens bedste
Årets bedste
Sidste års bedste