3 Replies - 1149 Views - Last Post: 12 July 2011 - 11:14 AM Rate Topic: -----

#1 soulcompetitor  Icon User is offline

  • New D.I.C Head

Reputation: 0
  • View blog
  • Posts: 4
  • Joined: 29-June 11

tab image change is working in IE7 but not in mozilla firefox....

Posted 04 July 2011 - 09:43 PM

tab image change is working in IE7 but not in mozilla firefox....any suggestion....!!


my code here


<?php session_start() ?>
<?php include("secure.php"); ?>
<!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=utf-8" />
<link href="stylesheet.css" rel="stylesheet" type="text/css" />
<script language="javascript">

function callpage(page, frame)
{
	var frame1 = document.getElementById("frame1");
	
	if (frame == 1)
	{
		frame1.src = "brandnamechange_tab1.php";
	}
	else if (frame == 2)
	{
		frame1.src = "brandnamechange_tab2.php";
	}
	
	document.getElementById('page1').background = "images/tab.gif";
	document.getElementById('page1').style.color = "#000000";




	document.getElementById('page2').background = "images/tab.gif";
	document.getElementById('page2').style.color = "#000000";
	
	document.getElementById(page).background = "images/tab.gif";
	document.getElementById(page).style.color = "";



	
}
</script>
</head>
<body onload="callpage('page1', 1)">
<table border="0" cellpadding="0" cellspacing="0" width="100%">
	<tr>
		<td height="26px" width="100%">

		<table width="100%" height="26px">
			<tr>
				<td width="21px">&nbsp;</td>
				<td width="100%" class="form_heading" align="left"><span>Regulatory:
				Brand Name Change</span></td>
			</tr>
		</table>
		</td>
	</tr>
	<tr>
		<td>

		<table width="100%" height="100%" border="0" cellpadding="0"
			cellspacing="0">
			<tr>
				<td width="1%">&nbsp;</td>
				<td width="99%" style="vertical-align: top;">
				<form name="form1" style="text-align: left;">
				<table border="0" cellpadding="0" cellspacing="0" class="tab">
					<tr class="bottom_slides_text">
						<td>&nbsp;</td>
					</tr>
					<tr height="30">
						<td width="113" background="images/tab_selected.gif" id="page1"
							onclick="callpage('page1', '1')">Last 30 Days</td>
							
						<td width="113" background="images/tab_selected.gif" id="page2"


							onclick="callpage('page2', '2')">Search</td>
								
					
					</tr>
					
				</table>
				<iframe id="frame1" name="frame1" width="99%"></iframe></form>
				</td>
			</tr>
		</table>
		</td>
	</tr>
</table>
<script language="javascript" type="text/javascript">
var divFrame = document.getElementById('frame1');
var height = screen.availHeight - 250;

divFrame.style.height = height + 'px';

</script>

</body>
</html>


MOD EDIT: Added code tags. When posting code...USE CODE TAGS!!!

:code:

This post has been edited by JackOfAllTrades: 05 July 2011 - 04:06 AM


Is This A Good Question/Topic? 0
  • +

Replies To: tab image change is working in IE7 but not in mozilla firefox....

#2 Atli  Icon User is offline

  • D.I.C Lover
  • member icon

Reputation: 3710
  • View blog
  • Posts: 5,958
  • Joined: 08-June 10

Re: tab image change is working in IE7 but not in mozilla firefox....

Posted 05 July 2011 - 12:37 AM

Hey.

The reason for that would be that the background attribute is not valid in either HTML4 nor XHTML. It's an old Netscape thing, which IE still implements for some reason. (Backwards compatibility, probably.)

In any case, today it's redundant. To apply a background image to an element in modern browsers, you use the CSS style background-image. (Or just background, if you want it more condensed.)

For instance:
<div id="myElem" style="background-image: url(/path/to/image.png)"></div>


In Javascript you manipulate this by using the style.backgroundImage property of a DOM element.
var domElem = document.getElementById('myElem');
domElem.style.backgroundImage= "url(/path/to/another_image.png)";




Keep in mind that Firefox is more standard-compliant than Internet Explorer, so when you run into problems where Firefox doesn't show things that IE does, it's likely that you're using one of IE's non-standard "features". You can (and should) use the W3C Markup Validation Service to check your markup, and it will show you all the errors you've made that would cause problems in standard compliant browsers. - Try running the code you posted through it, and you'll find the root of your problem in the error list.

P.S.
Please use [code] tags when you post code examples!

This post has been edited by Atli: 05 July 2011 - 12:39 AM

Was This Post Helpful? 0
  • +
  • -

#3 soulcompetitor  Icon User is offline

  • New D.I.C Head

Reputation: 0
  • View blog
  • Posts: 4
  • Joined: 29-June 11

Re: tab image change is working in IE7 but not in mozilla firefox....

Posted 12 July 2011 - 10:56 AM

still not working......!!
Was This Post Helpful? 0
  • +
  • -

#4 CTphpnwb  Icon User is online

  • D.I.C Lover
  • member icon

Reputation: 2889
  • View blog
  • Posts: 10,003
  • Joined: 08-August 08

Re: tab image change is working in IE7 but not in mozilla firefox....

Posted 12 July 2011 - 11:14 AM

You need to be much more specific. What advice did you use? What does your code look like now? What errors are you getting?

You would get more help if you asked the right questions, and if you asked them in the right forum. PHP has nothing to do with your browser or Javascript.
Was This Post Helpful? 0
  • +
  • -

Page 1 of 1