Javascript and CSS

Works fine in Firefox but having issues with IE

Page 1 of 1

4 Replies - 1689 Views - Last Post: 12 June 2006 - 04:15 PM

#1 Jakobi  Icon User is offline

  • New D.I.C Head

Reputation: 0
  • View blog
  • Posts: 7
  • Joined: 22-May 06

Javascript and CSS

Posted 12 June 2006 - 12:22 PM

Ok I was able to center my javascript using some CSS and adding a div surrounding the document.write section of the script

Like this:

<script language='Javascript' type='text/javascript' src='http://www.first-ward.com/TEST/scripts/Ads/adx.js'></script>
<script language='Javascript' type='text/javascript'>
<!--
   if (!document.phpAds_used) document.phpAds_used = ',';
   phpAds_random = new String (Math.random()); phpAds_random = phpAds_random.substring(2,11);
   
   document.write('<div id="ad">');
   document.write ("<" + "script language='Javascript' type='text/javascript' src='");
   document.write ("http://www.first-ward.com/TEST/scripts/Ads/adjs.php?n=" + phpAds_random);
   document.write ("&clientid=2&source=top+home+page&target=blank");
   document.write ("&exclude=" + document.phpAds_used);
   if (document.referrer)
	  document.write ("&referer=" + escape(document.referrer));
   document.write ("'><" + "/script>");
   document.write ('</div>');
//-->
</script>



#ad {
position:absolute;
top:212px; /*adjust this till its where you want it to be*/
left:187px; /*adjust this till its where you want it to be*/
z-index: 1

The issue is now with IE and its not recognizing the div. Looking for any suggestions to what I should do in regards to making IE work.

View the following using FIREFOX and IE and you can see the issue: SEE HERE

Any insight would be helpful.

Is This A Good Question/Topic? 0
  • +

Replies To: Javascript and CSS

#2 Jayman  Icon User is offline

  • Student of Life
  • member icon

Reputation: 418
  • View blog
  • Posts: 9,532
  • Joined: 26-December 05

Re: Javascript and CSS

Posted 12 June 2006 - 03:29 PM

It seems to me that you are rendering your javascript first, then the rest of the HTML renders. I think IE is doing exactly what you told it to do, based on position inside your code.

As a suggestion, try making your javascript a function and then creating a div element for your ad, place the div after the "banner" div element or thereabouts. Now add the javascript onload="name of your function" event to the ad div element you just created.

Basically you will force IE to place the ad in the correct position based on when it renders the object in the HTML code, even though you are telling IE based on your CSS.

This post has been edited by jayman9: 12 June 2006 - 03:37 PM

Was This Post Helpful? 0
  • +
  • -

#3 Jayman  Icon User is offline

  • Student of Life
  • member icon

Reputation: 418
  • View blog
  • Posts: 9,532
  • Joined: 26-December 05

Re: Javascript and CSS

Posted 12 June 2006 - 03:56 PM

Actually I forgot, you can just move the whole script down after the banner div.

Like this:
<!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>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>First-Ward</title>
<link href="style.css" rel="stylesheet" type="text/css" />

<script language='Javascript' type='text/javascript' src='http://www.first-ward.com/TEST/scripts/Ads/adx.js'></script>

</head>

<body>
<span class="users">1 Drunk Online</span><span class="date">Monday, 12 June 2006 05:41 pm</span>
<div id="header"><img alt="Navigation Menu" usemap="#nav_header" src="/TEST/images/header_logo_nav.jpg"/>
  <map name="nav_header" id="nav_header">
	<area shape="rect" coords="34,25,114,50" title="Home" href="#Home" alt="Home" />
	<area shape="rect" coords="34,53,114,78" title="Pics" href="#Pictures" alt="Pictures" />
	<area shape="rect" coords="34,82,114,106" title="Games" href="#Games" alt="Games" />
	<area shape="rect" coords="34,111,115,134" title="Flash" href="#Flash" alt="Flash" />
	<area shape="rect" coords="119,26,201,50" title="Videos" href="#Videos" alt="Videos" />
	<area shape="rect" coords="117,52,202,78" title="Forums" href="#Forums" alt="Forums" />
	<area shape="rect" coords="117,83,202,106" title="Links" href="#Links" alt="Links" />
	<area shape="rect" coords="118,110,204,134" title="Comics" href="#Comics" alt="Comics" />
  </map>
</div>
<!--<div id="navigation_top"></div>-->
<div id="banner"></div>
<div id="ad"><script language='Javascript' type='text/javascript'>
<!--
   if (!document.phpAds_used) document.phpAds_used = ',';
   phpAds_random = new String (Math.random()); phpAds_random = phpAds_random.substring(2,11);
   
   document.write('<div id="ad">');
   document.write ("<" + "script language='Javascript' type='text/javascript' src='");
   document.write ("http://www.first-ward.com/TEST/scripts/Ads/adjs.php?n=" + phpAds_random);
   document.write ("&amp;clientid=2&amp;source=top+home+page&amp;target=blank");
   document.write ("&amp;exclude=" + document.phpAds_used);
   if (document.referrer)
	  document.write ("&amp;referer=" + escape(document.referrer));
   document.write ("'><" + "/script>");
   document.write ('</div>');
//-->
</script></div>
<div id="main">
  <div class="leftcolumn">TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT</div>
  <div class="centerleftcolumn">TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT</div>
  <div class="centerrightcolumn">TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT </div>
  <div class="rightcolumn">TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT </div>
</div>
<div id="footer"></div>
</body>
</html>


This post has been edited by jayman9: 12 June 2006 - 03:58 PM

Was This Post Helpful? 0
  • +
  • -

#4 Jakobi  Icon User is offline

  • New D.I.C Head

Reputation: 0
  • View blog
  • Posts: 7
  • Joined: 22-May 06

Re: Javascript and CSS

Posted 12 June 2006 - 04:04 PM

So to understand you mean like this:

<div id="ad" onload="ad"></div>

Thank you for the suggestion since this has stumped me for days.
Was This Post Helpful? 0
  • +
  • -

#5 Jakobi  Icon User is offline

  • New D.I.C Head

Reputation: 0
  • View blog
  • Posts: 7
  • Joined: 22-May 06

Re: Javascript and CSS

Posted 12 June 2006 - 04:15 PM

Thank you for your assistance, it worked. Trying to understand so I can use this and this is the first time I have placed it in my page.

Thank you now I can look at this to follow my other Javascipt.
Was This Post Helpful? 0
  • +
  • -

Page 1 of 1