Avatar billede fatsvag Nybegynder
22. februar 2009 - 20:19 Der er 2 løsninger

Imagerotate, transparent png og IE 6

Hej.

Jeg er ved at lave en side hvor jeg skal have plottet nogle billeder hist og her ud fra noget data jeg henter fra en anden side. Disse billeder skal så også roteres ud fra det data jeg henter og regner på. Det virker fint i IE 7, Safari og Firefox, men vil gerne have det til at virke i IE 6 også. Jeg har næsten fået det til at virke, men ikke 100 %.

Her kan i se et stykke af min kode. Det hele foregår i en while der bliver kørt igennem for hvert billede der skal plottes.


echo <<<CSS
<!--[if gte IE 5.5]>
<![if lt IE 7]>
<style type="text/css">
#trans1img$t img { filter:progid:DXImageTransform.Microsoft.Alpha(opacity=0); }
#trans1img$t { display: inline-block; }
#trans1img$t { filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src="rotate1.php?grader=$grader"'); }
</style>
<![endif]>
<![endif]-->
CSS;


echo "<span id=\"trans1img$t\" style=\"position: absolute; margin-top:${"y{$p[$s]}"}px; margin-left:${"x{$p[$s]}"}px\"><a onclick=\"load('info.php?linje=$linje&amp;stop=$stop&amp;tognr=$tognr&amp;forsinkelse=$forsinkelse','med3'); return false;\"><img src=\"rotate1.php?grader=$grader\" alt=\"\"></a></span>";
$t++; // t er sat til 1 udenfor while


Altså den kører det hele igennem for hvert billede og hver gang er t steget med 1 så der i css'en bliver oprettet en ny div. Hvis ikke jeg gør det på denne måde vil alle billederne vende den samme vej da de jo alle vil være i samme div.
Ovenstående virker næsten perfekt. Det skal forståes på den måde at omkring 28 ud af 30 billeder bliver plottet korrekt. Men to af dem bliver plottet som de ville hvis jeg ikke havde lavet specielle regler for IE 6. Nemlig hvor det transparente område er lyseblåt.
Kan det være noget med at den glemmer noget af det, da min css jo ændrer sig. Ved ikke helt hvor pænt det er at bruge variabler i css, men kan ikke lige se nogen anden måde det kan laves på.

Hvis det er til nogen hjælp kan indholdet af rotate.php ses her:


<?php
header('Content-type: image/png');

$filnavn = './billeder/tog1.png';
$grader = $_GET['grader'];
$source = imagecreatefrompng($filnavn);
$rotate = imagerotate($source, $grader, -1);
imagealphablending($rotate, true);
imagesavealpha($rotate, true);
imagepng($rotate);
?>


Håber I kan hjælpe mig her. Skriv hvis i skal bruge mere info.
Avatar billede trissebasse Nybegynder
26. februar 2009 - 21:29 #1
Hej fatsvag.

Jeg tror dit problem er at IE6 slet ikke kan læse .png korrekt

... Sorry
Avatar billede fatsvag Nybegynder
27. februar 2009 - 23:57 #2
IE 6 er godt nok noget værre lort for at sige det lige ud. Men da det har en forholdsvis for markedsandel er man jo næsten nødt til at understøtte det.

Følgende stykke kode løste mit problem, hvis nogen er interesserede. Det er skræddersyet til den situation, så tvivler på nogen kan bruge det til noget, men nu ved jeg da hvordan man arbejder med gennemsigtige billeder i IE6/IE5.5 som skal roteres vha. php. :)

if (strpos($_SERVER['HTTP_USER_AGENT'], 'MSIE 5.5') !== FALSE | strpos($_SERVER['HTTP_USER_AGENT'], 'MSIE 6.0') !== FALSE) // Følgende er understøttelse af transparent png i Internet Explorer 5.5/6
{
echo "<div id=\"ie6\"><a style=\"width:17px; height:11px; filter: progid:DXImageTransform.Microsoft.Alpha(opacity=0); filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='rotate1.php?grader=$grader'); display: inline; position: absolute; margin-top:${"y{$p[$s]}"}px; margin-left:${"x{$p[$s]}"}px\" onclick=\"load('info.php?linje=$linje&amp;stop=$stop&amp;tognr=$tognr&amp;forsinkelse=$forsinkelse','enkelttogmed1'); return false;\"></a></div>";
}
else
{
echo "<a style=\"position: absolute; margin-top:${"y{$p[$s]}"}px; margin-left:${"x{$p[$s]}"}px\" onclick=\"load('info.php?linje=$linje&amp;stop=$stop&amp;tognr=$tognr&amp;forsinkelse=$forsinkelse','enkelttogmed1'); return false;\"><img src=\"rotate1.php?grader=$grader\" alt=\"\"></a>";

Giver lidt points til trissebasse for at gide læse tråden.
}
Avatar billede Ny bruger Nybegynder

Din løsning...

Tilladte BB-code-tags: [b]fed[/b] [i]kursiv[/i] [u]understreget[/u] Web- og emailadresser omdannes automatisk til links. Der sættes "nofollow" på alle links.

Loading billede Opret Preview
Kategori
Vi tilbyder markedets bedste kurser inden for webudvikling

Log ind eller opret profil

Hov!

For at kunne deltage på Computerworld Eksperten skal du være logget ind.

Det er heldigvis nemt at oprette en bruger: Det tager to minutter og du kan vælge at bruge enten e-mail, Facebook eller Google som login.

Du kan også logge ind via nedenstående tjenester