Jump to content

Different Browsers and changed to positioning/formatting


Recommended Posts

Hi guys, I created a website and I am having trouble with browsers. This is my website so far www.sign-technologies.net When you go into IE the positioning of some of my flash animations change. In Chrome and Firefox they are fine. Is there a piece of code I can use to detect, which browser is being used to view the site, so the code is adjusted to meet the requirements of the browser being used?

Link to post
Share on other sites

Hi POWERPLAY27, I can see that you are using ASP.NETIn your code-behind this will get the browser string from the User-Agent header:var browser = Request.Browser.Browser;Then you can have 'case' or 'if' statement where you can alter your code for specific browser. Hope this helps. Oleg

Link to post
Share on other sites
  • 1 month later...
Hi POWERPLAY27, I can see that you are using ASP.NETIn your code-behind this will get the browser string from the User-Agent header:var browser = Request.Browser.Browser;Then you can have 'case' or 'if' statement where you can alter your code for specific browser. Hope this helps. Oleg
<!--browser searching --><script type="text/javascript">var browser = "Unknown";var version = 0;if (window.opera){browser = "Opera";version = "5+";if (window.opera.setPreference){version = "9";}}else if(document.all){browser = "Internet Explorer";version = "6-";if (window.XMLHttpRequest){version = "7+"; (I'm guessing I would have to add something here?) }}else if (window.sidebar){browser = "Firefox";version = "1+";}document.write(browser + " " + version);	</script>

do you mean something like this? Have a look at this webpage www.sign-technologies.net/webdesigner.aspx in firefox/chrome/ safari and then have a look at the same webpage in I.E. You will notice that the flash animation writing seems more bigger than what is shown in the other browsers. I'm actually confused on what I have to actually adjust to make the content look the same in IE as it does in the other browsers.

Edited by POWERPLAY27
Link to post
Share on other sites
Compare the width, height used for embed (FF) to the width height of object (IE).
Sorry how would ago about doing this? I have checked the source code in IE and the width and height are the same, however in chrome (the other browser I use) I cannot see this information when looking at the source code.
Link to post
Share on other sites

The view source i see in FF and IE both show, the element object (note: this is old method, with new the object targets both crappy IE and other better browsers ) targets crappy IE, notice the width 490 x 320) and height is higher and wider than those set for embed (450 x 270) which targets much better browsers.

<div id="webdesignerFlash">         <object width="490" height="320" align="absmiddle" title="Web Designer" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=9,0,28,0" classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000">	    <param value="Web Designer.swf" name="movie">	    <param value="high" name="quality">	    <param value="transparent" name="wmode">	    <embed width="450" height="270" align="absmiddle" type="application/x-shockwave-flash" pluginspage="http://www.adobe.com/shockwave/download/download.cgi?P1_Prod_Version=ShockwaveFlash" wmode="transparent" quality="high" src="Web Designer.swf">	  </object>    </div>

Therefor it will be bigger and wider in IE, solution make width and height the same as those set in embed.

Link to post
Share on other sites
http://www.sign-technologies.net/Portfolio.aspx?portfolioid=3 I have one more issue in IE, have a look at this webpage and move the mouse around the screen, you should see the image going further and further below the screen changing its {margin-top} location.Do the same in the other browsers and this won't happen. Here is the asp code my friend used (he developed the whole website)
using System;using System.Collections.Generic;using System.Linq;using System.Web;using System.Web.UI;using System.Web.UI.WebControls;namespace SignTech{    public partial class Portfolio : System.Web.UI.Page    {	    int _portfolioId = 0;	    int _imageId = 0;	    protected void Page_Load(object sender, EventArgs e)	    {		    if(Request.QueryString["portfolioid"] != null)		    {			    string pi = Request.QueryString["portfolioid"];			    if(int.Parse(pi) > 0)			    {				    _portfolioId = int.Parse(pi);			    }		    }		    if (Request.QueryString["imageid"] != null)		    {			    string ii = Request.QueryString["imageid"];			    if (int.Parse(ii) > 0)			    {				    _imageId = int.Parse(ii);			    }		    }		    FillPortfolio();	    }	    private string GetStockPrice()	    {		    double randomStockPrice = 50 + new Random().NextDouble();		    return randomStockPrice.ToString("C");	    }	    private void FillPortfolio()	    {		    string tableStart = "<table class='tablecenterednoborders'>";		    string tableEnd = "</table>";		    string rs = "<tr>";		    string re = "</tr>";		    string cs = "<td class='cellcentered'>";		    string ce = "</td>";		    string content = "";		    List<PortfolioManager.PortfolioData> portfolios = new List<PortfolioManager.PortfolioData>();		    List<PortfolioManager.ImageData> images = new List<PortfolioManager.ImageData>();		    PortfolioManager pm = new PortfolioManager();		    //Load portfolio bar		    portfolios = pm.GetPortfolios();		    content = tableStart;		    content += rs;		    foreach (PortfolioManager.PortfolioData p in portfolios)		    {			    content += cs;			    content += "<a href='Portfolio.aspx?portfolioid=" + p.portfolioId + "'>";			    content += "<img class='portfoliothumbnail' src='" + pm.GetImageLocation(pm.GetFirstImageId(p.portfolioId)) + "' />";			    content += "</a>";			    content += ce;		    }		    content += re;		    content += tableEnd;		    divPortfolioThumbnails.InnerHtml = content;		    // Load image bar		    if(_portfolioId > 0 )		    {			    images = pm.GetImages(_portfolioId);		    }		    else		    {			    images = pm.GetImages(portfolios[0].portfolioId);		    }		    content = tableStart;		    content += rs;		    foreach (PortfolioManager.ImageData i in images)		    {			    content += cs;			    content += "<a href='Portfolio.aspx?portfolioid=" + i.portfolioId + "&imageid=" + i.imageId + "'>";			    content += "<img class='portfoliothumbnail' src='" + pm.GetImageLocation(i.imageId) + "' />";			    content += "</a>";			    content += ce;		    }		    content += re;		    content += tableEnd;		    divImageThumbnails.InnerHtml = content;		    // Load first image		    content = tableStart;		    content += rs;		    content += cs;		    if (_imageId > 0)		    {			    content += "<img class='portfolioimage' src='" + pm.GetImageLocation(_imageId) + "' />";		    }		    else		    {			    content += "<img class='portfolioimage' src='" + pm.GetImageLocation(images[0].imageId) + "' />";		    }		    content += ce;		    content += re;		    content += tableEnd;		    divPortfolioImage.InnerHtml = content;	    }    }}

Not sure if you know asp.net yourself, but if you do, can you see anything in that code which might be causing that to happen?

Link to post
Share on other sites

I don't even see a reason for that behavior in the rendered code. The style information of the element that grows does not actually change to make the element taller, there's nothing changing in the style information to cause that to happen. Sounds like an IE bug.

Link to post
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

Loading...
×
×
  • Create New...