Jump to content


Need help ASAP please coding ><!

Started by Clandestine, Sep 19 2006 02:01 PM

3 replies to this topic

#1 Clandestine

    * Forum Police *

  • Members
  • PipPipPip
  • 833 posts
  • Gender:Male
  • Location:Redondo Beach, CA

Posted 19 September 2006 - 02:01 PM

Alright, so im kinda lost here. Im not to good at coding and ive ran into some problems. IF you look at the site im making it looks ok in internet explorer, but looks like poop in FF. Also my navigation works in IE but not in FF.

Could anyone please help me fix this. I need help ASAP.

here look at it in IE and FF, IE looks what it is supposed to besides some image problems i have to fix that you probably will spot out. here ya go http://www.clandesti.../BHSM/index.php

heres the code for the nav menu

<!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>Untitled Document</title>
<script type="text/javascript" src="expandingMenu.js"></script>
<style>
ul#menu {
  width: 152px;
  list-style-type: none;
  margin: 0;
  padding: 0;
}

ul#menu ol {
  display: none;
  text-align: left;
  list-style-type: none;
  margin: 0;
  padding: 5px;
}

ul#menu li, 
  ul#menu a {
  font-family: verdana, sans-serif;
  font-size: 12px;
  color: #000000;
}
ul#menu ol li {
  border-bottom: none;
}

ul#menu ol li:before {
  content: "- ";
}

ul#menu a {
  text-decoration: none;
  outline: none;
}

ul#menu a:hover {
  color: #539dbc;
}

ul#menu a.active {
  color: #be5028;
}
</style>
</head>

<body>

<ul id="menu">
<li><a href="index.php">Home</a></li>
  <li><a href="Classes.php">Classes</a></li>
  <li>Events
	<ol>
	  <li><a href="#">Breakfast with Santa</a></li>
	  <li><a href="#">Monthly Seminars</a></li>
	  <li><a href="#">Annual Conference</a></li>
	  <li><a href="#">Fundraisers</a></li>
	</ol>
  </li>
  <li>Resources
	<ol>
	  <li><a href="#">Sub Item 3.1</a></li>
	  <li><a href="#">Sub Item 3.2</a></li>
	  <li><a href="#">Sub Item 3.3</a></li>
	</ol>
  </li>
  <li>Newsletter</li>
  <li>Job Oppurtunities</li>
  <li>Arizona Board</li>
  <li>Mission Statment</li>
  <li>Links
	  <ol>
	   <li>Link1</li>
	   <li>Link2</li>
	</ol>
  </li>
  <li>Contact</li>
</ul>
</body>
</html>

heres the java for the nav menu

/* This script and many more are available free online at
The JavaScript Source :: http://javascript.internet.com
Created by: Travis Beckham :: http://www.squidfingers.com | http://www.podlob.com
version date: 06/02/03 :: If want to use this code, feel free to do so,
but please leave this message intact. (Travis Beckham) */

// Node Functions

if(!window.Node){
  var Node = {ELEMENT_NODE : 1, TEXT_NODE : 3};
}

function checkNode(node, filter){
  return (filter == null || node.nodeType == Node[filter] || node.nodeName.toUpperCase() == filter.toUpperCase());
}

function getChildren(node, filter){
  var result = new Array();
  var children = node.childNodes;
  for(var i = 0; i < children.length; i++){
	if(checkNode(children[i], filter)) result[result.length] = children[i];
  }
  return result;
}

function getChildrenByElement(node){
  return getChildren(node, "ELEMENT_NODE");
}

function getFirstChild(node, filter){
  var child;
  var children = node.childNodes;
  for(var i = 0; i < children.length; i++){
	child = children[i];
	if(checkNode(child, filter)) return child;
  }
  return null;
}

function getFirstChildByText(node){
  return getFirstChild(node, "TEXT_NODE");
}

function getNextSibling(node, filter){
  for(var sibling = node.nextSibling; sibling != null; sibling = sibling.nextSibling){
	if(checkNode(sibling, filter)) return sibling;
  }
  return null;
}
function getNextSiblingByElement(node){
		return getNextSibling(node, "ELEMENT_NODE");
}

// Menu Functions & Properties

var activeMenu = null;

function showMenu() {
  if(activeMenu){
	activeMenu.className = "";
	getNextSiblingByElement(activeMenu).style.display = "none";
  }
  if(this == activeMenu){
	activeMenu = null;
  } else {
	this.className = "active";
	getNextSiblingByElement(this).style.display = "block";
	activeMenu = this;
  }
  return false;
}

function initMenu(){
  var menus, menu, text, a, i;
  menus = getChildrenByElement(document.getElementById("menu"));
  for(i = 0; i < menus.length; i++){
	menu = menus[i];
	text = getFirstChildByText(menu);
	a = document.createElement("a");
	menu.replaceChild(a, text);
	a.appendChild(text);
	a.href = "#";
	a.onclick = showMenu;
	a.onfocus = function(){this.blur()};
  }
}

if(document.createElement) window.onload = initMenu;

heres my HTML
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>Untitled Document</title>
</head>

<body bgcolor="CFCFCF" link="be5028" vlink="#539dbc" alink="#be5028">
<table width="792" height="100%" border="0" align="center" cellpadding="0" cellspacing="0">
  <tr>
	<td width="791" align="left" valign="top" bgcolor="#CFCFCF"><table width="791" height="123" border="0" cellpadding="0" cellspacing="0">
	  <tr>
		<td><img src="images/banner_791x123.gif" width="791" height="123"></td>
	  </tr>
	</table>
	  <table width="791" height="100%" border="0" cellpadding="0" cellspacing="0">
		<tr>
		  <td><table width="630" border="0" align="right" cellpadding="0" cellspacing="0">
			<tr>
			  <td width="630" height="35" background="images/content_top_630x35.gif"><table width="620" height="35" border="0" align="center" cellpadding="0" cellspacing="0">
				<tr>
				  <td width="650" height="35"><h2>Content</h2></td>
				</tr>
			  </table></td>
			</tr>
			<tr>
			  <td width="630" background="images/content_mid_630x19.gif"><table width="620" border="0" align="center" cellpadding="0" cellspacing="0">
				<tr>
				  <td>Add content here </td>
				</tr>
			  </table></td>
			</tr>
			<tr>
			  <td width="630" height="19" background="images/content_btm_630x19.gif"></td>
			</tr>
		  </table>
		  <table width="162" border="0" align="left" cellpadding="0" cellspacing="0">
			<tr>
			  <td width="162" height="35" background="images/nav_top_162_35.gif"><table width="150" height="35" border="0" align="center" cellpadding="0" cellspacing="0">
				<tr>
				  <td><h2 align="center">Navigation</h2></td>
				</tr>
			  </table></td>
			</tr>
			<tr>
			  <td width="162" background="images/nav_mid_162x6.gif"><table width="152" border="0" align="center" cellpadding="0" cellspacing="0">
				<tr>
				  <td><?php include("menu.html"); ?></td>
				</tr>
			  </table>			  
			</tr>
			<tr>
			  <td width="162" height="15"><img src="images/nav_btm_162x15.gif" width="162" height="15"></td>
			</tr>
		  </table></td>
		</tr>
	  </table>
	  <table width="791" height="61" border="0" cellpadding="0" cellspacing="0" background="images/footer_791x61.gif">
		<tr>
		  <td align="left" valign="bottom"><table width="791" border="0" cellspacing="0" cellpadding="10">
			<tr>
			  <td align="left"><font color="#FFFFFF">&copy;2006 Single Mom Foundation</font></td>
			  <td align="right"><font color="#FFFFFF">Site created by <a href="http://www.clandestinedesigns.com">Devyn Challman</a></font></td>
			</tr>
		  </table></td>
		</tr>
	  </table></td>
  </tr>
</table>
</body>
</html>

The navigation works fine until I start linking them to links, then it doesnt seem to work

please any help would be great!

Thank you!

-Devyn

Edited by Clandestine, 19 September 2006 - 02:19 PM.

#2 rc69

    PHP Master PD

  • P2L Staff
  • PipPipPipPip
  • 3,827 posts
  • Gender:Male
  • Location:Here
  • Interests:Web Development

Posted 19 September 2006 - 07:23 PM

When you say "java for the nav menu" you of course mean JavaScript right? I say this because java is in no way affiliated with javascript.

As for actual help, i would start by saying, ditch what ever WYSIWYG editor you used and start again from scratch. I'm assuming you used an editor because of the way the code looks (use of tables, attributes, font tags...).

note: Just validated your page (it's amazing what this thing will point out some times), and you are mis-using your php. If you include something, you do not need the rest of the html there, try removing all html but that which is important to the nav from the first block of code and see if it helps.

Edited by rc69, 19 September 2006 - 07:27 PM.

#3 Clandestine

    * Forum Police *

  • Members
  • PipPipPip
  • 833 posts
  • Gender:Male
  • Location:Redondo Beach, CA

Posted 20 September 2006 - 10:22 PM

View Postrc69, on Sep 20 2006, 12:22 AM, said:

When you say "java for the nav menu" you of course mean JavaScript right? I say this because java is in no way affiliated with javascript.

As for actual help, i would start by saying, ditch what ever WYSIWYG editor you used and start again from scratch. I'm assuming you used an editor because of the way the code looks (use of tables, attributes, font tags...).

note: Just validated your page (it's amazing what this thing will point out some times), and you are mis-using your php. If you include something, you do not need the rest of the html there, try removing all html but that which is important to the nav from the first block of code and see if it helps.

Hey rc69, How do I work this validation thing? Its saying things that arnt true, like / > when its really /> in my code with no spaces.

Also i erased the menu HTML code so it looks like this now, but it still doesnt work in FF only in IE it works.

<head>
<script type="text/javascript" src="expandingMenu.js"></script>
<style>
ul#menu {
  width: 152px;
  list-style-type: none;
  margin: 0;
  padding: 0;
}

ul#menu ol {
  display: none;
  text-align: left;
  list-style-type: none;
  margin: 0;
  padding: 5px;
}

ul#menu li, 
  ul#menu a {
  font-family: verdana, sans-serif;
  font-size: 12px;
  color: #000000;
}
ul#menu ol li {
  border-bottom: none;
}

ul#menu ol li:before {
  content: "- ";
}

ul#menu a {
  text-decoration: none;
  outline: none;
}

ul#menu a:hover {
  color: #539dbc;
}

ul#menu a.active {
  color: #be5028;
}
</style>
</head>

<body>

<ul id="menu">
  <li><a href="index.php">Home</a></li>
  <li><a href="classes.php">Classes</a></li>
  <li>Events
	<ol>
	  <li><a href="breakfast_with_santa.php">Breakfast with Santa</a></li>
	  <li><a href="monthly_seminars.php">Monthly Seminars</a></li>
	  <li><a href="annual_conference.php">Annual Conference</a></li>
	  <li><a href="fundraiser.php">Fundraisers</a></li>
	</ol>
  </li>
  <li><a href="resources.php">Resources</a></li>
  <li><a href="newsletter.php">Newsletter</a></li>
  <li><a href="letters_from_single_moms.php">Letters from Single Moms</a></li>
  <li><a href="job_opportunities.php">Job Opportunities</a></li>
  <li><a href="az_board.php">Arizona Board</a></li>
  <li><a href="mission_statement.php">Mission Statement</a></li>
  <li>Links
	  <ol>
	   <li>Link1</li> <!--- edit link --->
	   <li>Link2</li>
	   <li>Link3</li>
	  <li><a href="http://www.studentmom.com/homepage.html">Student Mom</a></li>
	</ol>
  </li>
  <li><a href="contact.php">Contact</a></li>
</ul>
</body>
</html>
<head>
<script type="text/javascript" src="expandingMenu.js"></script>
<style>
ul#menu {
  width: 152px;
  list-style-type: none;
  margin: 0;
  padding: 0;
}

ul#menu ol {
  display: none;
  text-align: left;
  list-style-type: none;
  margin: 0;
  padding: 5px;
}

ul#menu li, 
  ul#menu a {
  font-family: verdana, sans-serif;
  font-size: 12px;
  color: #000000;
}
ul#menu ol li {
  border-bottom: none;
}

ul#menu ol li:before {
  content: "- ";
}

ul#menu a {
  text-decoration: none;
  outline: none;
}

ul#menu a:hover {
  color: #539dbc;
}

ul#menu a.active {
  color: #be5028;
}
</style>
</head>

<body>

<ul id="menu">
  <li><a href="index.php">Home</a></li>
  <li><a href="classes.php">Classes</a></li>
  <li>Events
	<ol>
	  <li><a href="breakfast_with_santa.php">Breakfast with Santa</a></li>
	  <li><a href="monthly_seminars.php">Monthly Seminars</a></li>
	  <li><a href="annual_conference.php">Annual Conference</a></li>
	  <li><a href="fundraiser.php">Fundraisers</a></li>
	</ol>
  </li>
  <li><a href="resources.php">Resources</a></li>
  <li><a href="newsletter.php">Newsletter</a></li>
  <li><a href="letters_from_single_moms.php">Letters from Single Moms</a></li>
  <li><a href="job_opportunities.php">Job Opportunities</a></li>
  <li><a href="az_board.php">Arizona Board</a></li>
  <li><a href="mission_statement.php">Mission Statement</a></li>
  <li>Links
	  <ol>
	   <li>Link1</li> <!--- edit link --->
	   <li>Link2</li>
	   <li>Link3</li>
	  <li><a href="http://www.studentmom.com/homepage.html">Student Mom</a></li>
	</ol>
  </li>
  <li><a href="contact.php">Contact</a></li>
</ul>
</body>
</html>

Also if you look at my site right now in FF how come there are those big caps in between each table? How do i get rid of them? I want to make the site look like it does in IE but in FF. Can you help me do that?


Thanks
-Devyn

#4 rc69

    PHP Master PD

  • P2L Staff
  • PipPipPipPip
  • 3,827 posts
  • Gender:Male
  • Location:Here
  • Interests:Web Development

Posted 21 September 2006 - 11:01 PM

Well, again, when i said all, i meant all.
<script type="text/javascript" src="expandingMenu.js"></script>
<style type="text/css">
ul#menu {
  width: 152px;
  list-style-type: none;
  margin: 0;
  padding: 0;
}

ul#menu ol {
  display: none;
  text-align: left;
  list-style-type: none;
  margin: 0;
  padding: 5px;
}

ul#menu li, 
  ul#menu a {
  font-family: verdana, sans-serif;
  font-size: 12px;
  color: #000000;
}
ul#menu ol li {
  border-bottom: none;
}

ul#menu ol li:before {
  content: "- ";
}

ul#menu a {
  text-decoration: none;
  outline: none;
}

ul#menu a:hover {
  color: #539dbc;
}

ul#menu a.active {
  color: #be5028;
}
</style>

<ul id="menu">
  <li><a href="index.php">Home</a></li>
  <li><a href="classes.php">Classes</a></li>
  <li>Events
	<ol>
	  <li><a href="breakfast_with_santa.php">Breakfast with Santa</a></li>
	  <li><a href="monthly_seminars.php">Monthly Seminars</a></li>
	  <li><a href="annual_conference.php">Annual Conference</a></li>
	  <li><a href="fundraiser.php">Fundraisers</a></li>
	</ol>
  </li>
  <li><a href="resources.php">Resources</a></li>
  <li><a href="newsletter.php">Newsletter</a></li>
  <li><a href="letters_from_single_moms.php">Letters from Single Moms</a></li>
  <li><a href="job_opportunities.php">Job Opportunities</a></li>
  <li><a href="az_board.php">Arizona Board</a></li>
  <li><a href="mission_statement.php">Mission Statement</a></li>
  <li>Links
	  <ol>
	   <li>Link1</li> <!--- edit link --->
	   <li>Link2</li>
	   <li>Link3</li>
	  <li><a href="http://www.studentmom.com/homepage.html">Student Mom</a></li>
	</ol>
  </li>
  <li><a href="contact.php">Contact</a></li>
</ul>
You shouldn't have <html> <head> or <body> tags inside a file that's going to be included.

And that space doesn't matter (really, it doesn't), it's also just something to do with their formatting that it even shows up.

Since i don't like to deal with large amounts of html (and i don't even have time to post this right now), i'll let somebody else help, but hopefully the above will fix some things.
Back to Programming and General Web Design · Next Unread Topic →


1 user(s) are reading this topic

0 members, 1 guests, 0 anonymous users

  1. Pixel2Life Forum
  2. → Help Section
  3. → Programming and General Web Design