Witam,
stworzyłem stronę opartą na DIVach, na której umieściłem menu wykonane w technologii Flash. Mam problem z prawidłowym wyświetleniem tegoż menu w IE (w Firefox, Opera, Chrome wszystko wyświetla prawidłowo), mianowicie animacja jest zmniejszana o połowę i umieszczona jakby nad divem.
Poglądowy obraz:
(IMG:
http://img26.imageshack.us/img26/1939/75101232.png)
Całe menu tzn. tło, które dostosowuje się do szerokości strony oraz obiekt Flash jest umieszczone w jednym DIVie (obszar zaznaczony zieloną kreską).
Jak widać Flash "połowi DIVa" w ten sposób, że animacja jest w górnej części, a "pusty" DIV (opisany przez CSS) w dolnej.
Co może być przyczyną owej nieprawidłowości? Chciałbym, aby animacja wyświetlała się w 100% rozmiarze,a co za tym idzie, aby wypełniała menu na całej wysokości.
Dla porządku zamieszczam także źródło HTML/PHP i CSS:
<?php echo '<'.'?xml version="1.0" encoding="iso-8859-2"?'.'>'."\n";
if($_GET['strona'] == 'kontakt'){
$param = "?param=2";
} else{
$param = "?param=1";
}
?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"> <meta http-equiv="Content-Type" content="text/html, charset=iso-8859-2" /> <link href="style.css" rel="stylesheet" type="text/css" /> <script type="text/javascript"> //<![CDATA[
function rozmiar(param){
fs = param + 'px';
document.getElementById('tresc').style.fontSize=fs;
lh = param*1.5;
lh = lh + 'px'
document.getElementById('tresc').style.lineHeight=lh;
}
//]]>
<table align="center" cellspacing="0" cellpadding="0" style="height: 63px; width: 1024px;"> <td rowspan="2" style="width: 215px; text-align: right; vertical-align: middle;"> <a href="/index.php?strona=home#top" title=""><img src="/grafika/logo_top.png" alt="" /></a> <td style="width: 567px; text-align: right; vertical-align: top;"> <a href="/index.php?strona=mapa" title="" style="font-variant: small-caps; font-size: 10px; color: #FFFFFF;">mapa strony
</a> <td style="width: 467px; text-align: right; vertical-align: bottom; padding-right: 5px;"> <a onclick="rozmiar('10')" title="10px" style="font-size: 10px; color: #FFFFFF; cursor: pointer">A
</a> <a onclick="rozmiar('12')" title="12px" style="font-size: 12px; color: #FFFFFF; cursor: pointer">A
</a> <a onclick="rozmiar('14')" title="14px" style="font-size: 14px; color: #FFFFFF; cursor: pointer">A
</a> <a onclick="rozmiar('16')" title="16px" style="font-size: 16px; color: #FFFFFF; cursor: pointer">A
</a> <a onclick="rozmiar('20')" title="20px" style="font-size: 20px; color: #FFFFFF; cursor: pointer">A
</a>
<object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=10,0,0,0" width="1025" height="130" id="naglowek" align="middle"> <param name="allowScriptAccess" value="sameDomain" /> <param name="allowFullScreen" value="false" /> <param name="movie" value="naglowek2.swf" /><param name="quality" value="high" /><param name="bgcolor" value="#ffffff" /> <embed src="naglowek2.swf<?php echo $param; ?>" quality="high" bgcolor="#ffffff" width="1025" height="130" name="naglowek" align="middle" allowScriptAccess="sameDomain" allowFullScreen="false" type="application/x-shockwave-flash" pluginspage="http://www.adobe.com/go/getflashplayer" />
<?php
$tresc = $_GET['strona'];
if (empty ($tresc))
{
$tresc = 'home';
}
if (file_exists('pliki/'.$tresc.'.php'))
{
include 'pliki/'.$tresc.'.php';
} else {
echo '<center>Przykro mi, ale podana strona nie istnieje.
</center><p style="height: 200px;"></p></br>';
}
?>
<table cellspacing="0" cellpadding="0" style="height: 63px; width: 100%;"> <tr><td style="width: 20%; text-align: right; vertical-align: middle;">
<td style="text-align: center; vertical-align: middle;">
Copyright
<?php echo date('Y'); ?> Sianko
<br /><br />
<td style="width: 20%; text-align: right; vertical-align: middle; padding-right: 5px;"> STATYSTYKI
body{
background: #525252;
color: #FFFFFF;
font-size: 14px;
font-family: Calibri, Arial;
}
a{
color: #FFFFFF;
text-decoration: none;
border-bottom: 1px dashed #da0000;
cursor: pointer;
}
a:hover{
color: #9d0000;
text-decoration: none;
border-bottom: 1px dashed #FFFFFF;
cursor: pointer;
}
a.kontakt{
color: #FFFFFF;
text-decoration: none;
border: 0px;
cursor: pointer;
}
a.kontakt:hover{
color: #9d0000;
text-decoration: none;
border: 0px;
cursor: pointer;
}
a.pomoc{
color: #FFFFFF;
text-decoration: none;
border: 0px;
cursor: pointer;
}
a.pomoc:hover{
color: #9d0000;
text-decoration: none;
border: 0px;
cursor: pointer;
}
img{
border: 0px;
}
#strona{
width: 100%;
}
#naglowek{
background: url('/grafika/tlo_top1.png') repeat;
height: 63px;
width: 100%;
overflow: hidden;
clear: both;
}
#naglowek_in{
background: url('/grafika/top1.png') no-repeat;
height: 63px;
width: 1024px;
overflow: hidden;
}
#menu{
background: url('/grafika/tlo_menu_2.png') repeat;
height: 130px;
width: 100%;
clear: both;
overflow: hidden;
margin: 0px;
padding: 0px;
}
#clear{
background: url('/grafika/tlo_top2.png') repeat;
width: 100%;
height: 20px;
clear: both;
}
#tresc_out{
background: #656465;
overflow: hidden;
clear: both;
}
#tresc{
background: #656465;
width: 1025px;
text-align: justify;
line-height: 21px;
padding-left: 0px;
padding-right: 0px;
padding-top: -30px;
padding-bottom: 10px;
margin: 0px;
margin-top: 0px;
overflow: hidden;
}
#stopka{
background: url('/grafika/tlo_bottom.png') repeat;
height: 61px;
width: 100%;
font-size: 12px;
overflow: hidden;
clear: both;
}
Z góry dziękuję i pozdrawiam (IMG:
style_emoticons/default/winksmiley.jpg)
Problem rozwiązany. Temat do zamknięcia.
Problem tkwił w identyfikatorze animacji, który był taki sam jak id div-a. (IMG:
style_emoticons/default/blinksmiley.gif)