Xpoint
   [напомнить пароль]

Ошибка фильтра прозрачности в VML

Метки: [без меток]
2008-02-07 17:51:04 [обр] Madman[досье]

Всем добрый день!

Вот возникла у меня проблема. Отрисовываю я значит некую фигуру в VML кривыми Безье (код ниже). Помещаю все это в группу. И необходимо мне сделать всей группе полупрозрачность скажем 75%!
Вот здесь меня ждала неожиданось! Когда я добавил группе фильтр "opacity", то по контуру кривых образовалась легкая (примерно 1 рх) серая обводка.
Тогда решил сделать прозрачными рамки кривых при помощи аттрибута "opacity" элемента <v:stroke>. Это помогло. Но, прозрачными стали кривые, а не блок с кривыми! А стало быть при наложении кривых друг на друга прозрачность терялась.

Вот с этим у меня и связан вопрос: как избавиться от обводки группы серой рамкой?

Здесь привожу часть кода моего VML!

<?xml version="1.0" encoding="windows-1251"?> 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> 
<html xmlns:v="urn:schemas-microsoft-com:vml" xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=windows-1251" /> 
<title>VML</title> 
<style type="text/css"> 
* { 
   margin:0; 
   padding:0; 
} 

html, 
body { 
   height:100%; 
} 

body { 
   background:#fff; 
} 

#background { 
   position:relative; 
   width:1024px; 
   height:768px; 
   overflow:visible; 
} 
</style> 

<!--[if IE]> 
<style type="text/css"> 
v\:* { 
   behavior: url(#default#VML); 
   display:inline-block; 
   position:absolute; 
   top:0; 
   left:0; 
} 

v\:shape, 
v\:group, 
v\:rect, 
v\:vmlframe { 
   width: 100%; 
   height: 100%; 
} 

</style> 
<![endif]--> 
</head> 

<body> 
   <div id="background"> 
      <v:group coordsize="1024,768" coordorigin="0,0"> 
         <v:shapetype id="curve" filled="false" coordorigin="0,0" coordsize="1024,768"><v:stroke weight="4"></v:stroke></v:shapetype> 
         <v:rect stroked="false"><v:fill color="#8B9E91" opacity="0.5"></v:fill></v:rect> 
         <v:group style="filter:progid:DXImageTransform.Microsoft.Alpha(opacity=50)"> 
            <v:shape type="#curve" strokecolor="#FFFFFF" path="m 0,219 v 427,-403, 1024,47, 1024,189"/> 
            <v:shape type="#curve" strokecolor="#FEFEFE" path="m 0,218 v 427,-398, 1022,52, 1024,192"/> 
            <v:shape type="#curve" strokecolor="#FDFDFD" path="m 0,217 v 427,-393, 1019,58, 1024,196"/> 
            <v:shape type="#curve" strokecolor="#FCFDFC" path="m 0,216 v 426,-388, 1017,62, 1024,199"/> 
            <v:shape type="#curve" strokecolor="#FBFCFB" path="m 0,215 v 426,-383, 1014,67, 1024,202"/> 
            <v:shape type="#curve" strokecolor="#FAFBFA" path="m 0,214 c 426,-164, 1012,286, 1024,419"/> 
            <v:shape type="#curve" strokecolor="#F9FAF9" path="m 0,213 v 426,-373, 1009,77, 1024,208"/> 
            <v:shape type="#curve" strokecolor="#F8F9F8" path="m 0,212 v 426,-367, 1007,82, 1024,213"/> 
            <v:shape type="#curve" strokecolor="#F7F8F7" path="m 0,211 v 426,-362, 1004,87, 1024,215"/> 
            <v:shape type="#curve" strokecolor="#F6F8F7" path="m 0,210 v 426,-357, 1002,92, 1024,218"/> 
            <v:shape type="#curve" strokecolor="#F5F7F6" path="m 0,209 v 426,-352, 999,97, 1024,221"/> 
            <v:shape type="#curve" strokecolor="#F4F6F5" path="m 0,208 v 426,-347, 997,102, 1024,225"/> 
            <v:shape type="#curve" strokecolor="#F3F5F4" path="m 0,207 c 425,-135, 994,314, 1024,435"/> 
            <v:shape type="#curve" strokecolor="#F2F4F3" path="m 0,206 c 425,-131, 992,318, 1024,437"/> 
            <v:shape type="#curve" strokecolor="#F1F3F2" path="m 0,205 v 425,-332, 989,118, 1024,234"/> 
            <v:shape type="#curve" strokecolor="#F0F3F1" path="m 0,204 v 425,-326, 987,123, 1024,238"/> 
            <v:shape type="#curve" strokecolor="#EFF2F0" path="m 0,203 c 425,-119, 984,330, 1024,444"/> 
         </v:group> 
      </v:group> 
   </div> 
</body> 
</html>

Всем заранее благодарен!

спустя 1 год 1 месяц [обр] Denis Usenko(0/7)[досье]

Madman, я извиняюсь что поднимаю тему, у меня схожая проблема, если нашли в чем была причина, отпишитесь, плиз.
Это, действительно, странный баг с рамками:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0//EN" "http://www.w3.org/TR/REC-html40/strict.dtd">
<html>
<head>
<style type="text/css">
.vmlContainer, v\:*{
    position: absolute;
    left: 0px;
    top: 0px;
    width: 100%;
    height: 100%;
}
</style>
</head>
<body style="overflow: auto">

<?import namespace="v" urn="urn:schemas-microsoft-com:vml" implementation="#default#VML" declareNamespace ?>

<div style="left: 10px; top: 10px; width: 400px; height: 400px" class="vmlContainer">
<v:group coordsize = "400,400">

    <v:rect stroked="false" fillcolor="#000" filled="true" ></v:rect>
    <v:rect stroked="false" fillcolor="#FFF" filled="true" ></v:rect>

</v:group>
</div>

</body>
</html>

Здесь два абсолютно спозиционированных прямоугольника, одинаковых размеров, один точно поверх другого. Первый — черный, поверх него белый, рамки отключены. Проблема в том, что рамка не отсутствует, а становиться полупрозрачной, в данном случае серой. Если расположить в первом прямоугольнике, например, градиент, то рамка будет градиентной.

Powered by POEM™ Engine Copyright © 2002-2005