|
Rank: Member Groups: Member
Joined: 2/6/2009 Posts: 26
|
Hi, I'm using the EO Dialog control to display a page. If I load the page outside of the EO Dialog everything is fine in both IE8 and Google Chrome. However, when I load the exact same page through EO Dialog things go wrong in IE8, but are ok in Google Chrome. It feels like an IE8 issue, but I'm hoping someone has come across it before and maybe knows whether it's some property/style I need to change on the EO Dialog or whether it's something wrong with IE8. I've uploaded a couple of screen grabs that highlight the problem: Internet Explorer 8 Screen GrabGoogle Chrome Screen GrabYou'll notice the text looks different. Any ideas? David.
|
|
Rank: Member Groups: Member
Joined: 2/6/2009 Posts: 26
|
Hi,
Just an update to this. The same thing happens if you go to the EO Live Demo site and access the Dialog --> Features --> Content URL demo and click Show Modeless or Show Modal - the fonts don't look right, but they do if you access same page from Chrome or FireFox.
Is it something that can be fixed within the Dialog control or is it just an IE problem?
David.
|
|
Rank: Administration Groups: Administration
Joined: 5/27/2007 Posts: 24,194
|
Hi,
We can't notice any difference. Even the screenshots look the same to us. Can you point out where the difference is?
Thanks
|
|
Rank: Member Groups: Member
Joined: 2/6/2009 Posts: 26
|
Hi,
The fonts look totally different. In Chrome they appear as bold, in IE8 they are not bold. But it's more than that, the quality and general look of the fonts just doesn't seem right.
David.
|
|
Rank: Administration Groups: Administration
Joined: 5/27/2007 Posts: 24,194
|
That's interesting. We do see the difference now. The page is loaded with an iframe "in theory" there shouldn't be any difference. With our demo page we do see IE 8 renders the font with some sort of anti-alias smooth out effect, but the result is the opposite where Chrome renders the font as clear and IE 8's rendering appears to be "heavier" but also it is clearly not bold.
I don't think there is anyway to control the font "quality" with code. The root of the problem can be that certain properties of the font (such as font weight in your case) are changed. Unfortunately we can not reproduce it with our demo code (we can not see one as bold and the other as not). Can you create a test project to demonstrate this?
Thanks
|
|
Rank: Member Groups: Member
Joined: 2/6/2009 Posts: 26
|
Hi, I've narrowed it down to the ShadowDepth property. When I remove this the page displays ok in the dialog. I've put a small test project together. This is the code: Default.aspx:
Code: HTML/ASPX
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %>
<%@ Register Assembly="EO.Web" Namespace="EO.Web" TagPrefix="eo" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title>Untitled Page</title>
<script type="text/javascript">
function ShowDialog()
{
eo_GetObject('Dialog1').setCaption('Assets');
eo_GetObject('Dialog1').show(true);
}
function ShowDialog2()
{
eo_GetObject('Dialog2').setCaption('Assets');
eo_GetObject('Dialog2').show(true);
}
</script>
</head>
<body>
<form id="form1" runat="server">
<asp:ScriptManager ID="ScriptManager1" runat="server" />
<div>
<eo:Dialog runat="server" ID="Dialog1" ContentUrl="test.htm" HeaderHtml="Preview"
FooterHtml=" " BorderStyle="Solid" CloseButtonUrl="00070101" AllowResize="True"
ControlSkinID="None" Width="800px" ShadowDepth="5" BorderWidth="2px" Height="500px"
ShadowColor="LightGray" BorderColor="#335C88" ResizeImageUrl="00020014">
<FooterStyleActive CssClass="eo_dialog_footer"></FooterStyleActive>
<HeaderStyleActive CssClass="eo_dialog_header"></HeaderStyleActive>
<ContentStyleActive CssClass="eo_dialog_content"></ContentStyleActive>
</eo:Dialog>
<eo:Dialog runat="server" ID="Dialog2" ContentUrl="test.htm" HeaderHtml="Preview"
FooterHtml=" " BorderStyle="Solid" CloseButtonUrl="00070101" AllowResize="True"
ControlSkinID="None" Width="800px" BorderWidth="2px" Height="500px"
ShadowColor="LightGray" BorderColor="#335C88" ResizeImageUrl="00020014">
<FooterStyleActive CssClass="eo_dialog_footer"></FooterStyleActive>
<HeaderStyleActive CssClass="eo_dialog_header"></HeaderStyleActive>
<ContentStyleActive CssClass="eo_dialog_content"></ContentStyleActive>
</eo:Dialog>
<a href="javascript:void ShowDialog();">Show Dialog With Fault</a>
<a href="javascript:void ShowDialog2();">Show Dialog Without Fault</a>
</div>
</form>
</body>
</html>
Stylesheet; main.css
Code: CSS
body
{
font: 100% arial, helvetica, sans-serif;
}
div#pagingdiv
{
font-size:x-small;
font-weight:bold;
}
The dialog html; test.htm:
Code: HTML/ASPX
<!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">
<head>
<link rel="stylesheet" type="text/css" href="main.css" />
</head>
<body>
<form name="aspnetForm" method="post" id="aspnetForm">
<div id="pagingdiv">
<span class="currentpage">Some Test Text</span>
</div>
</form>
</body>
</html>
|
|