I have this js code
$("#sortable").sortable({
axis: 'y',
handle: '.fancybox',
update: function() {
var order = $('#sortable').sortable('serialize');
$("#sortable").load("inc/ajax/sortable/update2.php?"+order);
alert(order);
}
});
and I populate the list with php:
foreach ($stmt->fetchAll(PDO::FETCH_ASSOC) as $result)
{
$_SESSION['img'][]=$result['id_imag'];
$img[]="
<div class='highlight-3' width='100%'>
<li id='".$result['id_imag']."'>
<a class='fancybox' href='".$result['den_img']."' data-fancybox-group='gallery' title='Reian Imob' >
<img src='".$result['den_img']."' id='".$result['id_imag']."' ></a>
<a href='#' id='".$result['id_imag']."' class='del' onclick='delete_imag_mod(this);' >Delete</a>
</li>
</div>";
}
The html:
<ul class="gallery" id="sortable" style="background:#FCFCFC; width:100%">
<?php
$images=$db->select_images ($_POST['vid']);
if($nr_imag>0) {
foreach($images as $val)
{
echo $val;
}
}
?>
</ul>
The problem is: var order don't get the values. How can I fix it?
Your html code should look something like this:
<ul id="sortable">
<li id="li_first"> // here undercsore is mandatory
<div>some text</div>
</li>
<li id="li_second"> // here undercsore is mandatory
<div>some text</div>
</li>
</ul>
For more info check this link : http://api.jqueryui.com/sortable/#method-serialize
Related
my view
<div class="dropdown1">
<button class="dropbtn1">Asia</button>
<div class="dropdown1-content">
<li>
<ul style="height:520px; overflow: auto">
<?php foreach ($result as $row) {?>
<li>
<a href="<?php echo base_url(); ?>index.php/MyWeb_Controller/countriesView/<?php echo $row['count_name']?>">
<?php echo $row['count_name'];?>
</a>
</li>
<?php } ?>
</ul>
</li>
</div>
</div>
my controller
public function countriesView($a){
$this->load->helper('url');
$this->load->view('Country_View');
var_dump($a);die();
}
the result is show like this
string(12) "%20%20BRUNEI"
i want to show only the country name 'BRUNEI'
You can use - (dash) instant of space because space value change in url like %20%. Try the following code i have replace space to - in view and revert it on controller
View :
<div class="dropdown1">
<button class="dropbtn1">Asia</button>
<div class="dropdown1-content">
<li>
<ul style="height:520px; overflow: auto">
<?php foreach ($result as $row) {?>
<li>
<?php $county_name = str_replace(' ','-',$row['count_name']); ?>
<a href="<?php echo base_url(); ?>index.php/MyWeb_Controller/countriesView/<?php echo $county_name; ?>">
<?php echo $row['count_name'];?>
</a>
</li>
<?php } ?>
</ul>
</li>
</div>
</div>
Controller :
public function countriesView($a){
$this->load->helper('url');
$this->load->view('Country_View');
$a = str_replace('-',' ',$a);
var_dump($a);die():
}
Hi' I'm trying to get value with jquery with no success.
This part of the code I get with ajax and it's changes (it's part of a loop in function.php)
if ($termschildren) {
echo '<ul class="BlaBla">';
foreach ( $termschildren as $termchildren ) {
echo '<li class="BlaBlaLi">';
echo '' . $c_term_name->name . '';
echo '</li>';
echo '</ul>';
} else {
echo ' ';
}
die();
the ajax is return to a div called 'childrens_world'
echo '<div class="childrens_world">';
echo ' '; //for start
echo '</div>';
this is the jquery I use. I can't get the data-filter value. (the loop is fine, in the source code i see it well)
$filterLinksChildren = $('.tax-filter-children');
$('.childrens_world').on("click", $filterLinksChildren, function(e) {
var filt = $filterLinksChildren.data('filter');
//do something;
)};
I use the data-filter (var filt) to send to isotope jquery function
Thanks for any help
A couple of minor fixes:
Make the following as a string variable as opposed to a jQuery selector.
From:
$filterLinksChildren = $('.tax-filter-children');
To
filterLinksChildren = '.tax-filter-children';
There's apparently a small typographical error towards the end of the function:
)}; should actually be });
So, your complete solution would be something like the following:
filterLinksChildren = ".tax-filter-children";
$('.childrens_world').on("click", filterLinksChildren, function(e) {
alert($(this).data("filter"));
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="childrens_world">
<ul class="BlaBla">
<li class="BlaBlaLi">
<a href="#" class="tax-filter-children" data-filter="a1">a1
</a>
</li>
<li class="BlaBlaLi">
<a href="#" class="tax-filter-children" data-filter="a2">a2
</a>
</li>
<li class="BlaBlaLi">
<a href="#" class="tax-filter-children" data-filter="a3">a3
</a>
</li>
</ul>
</div>
<hr>
<div class="childrens_world">
<ul class="BlaBla">
<li class="BlaBlaLi">
<a href="#" class="tax-filter-children" data-filter="b1">b1
</a>
</li>
<li class="BlaBlaLi">
<a href="#" class="tax-filter-children" data-filter="b2">b2
</a>
</li>
<li class="BlaBlaLi">
<a href="#" class="tax-filter-children" data-filter="b3">b3
</a>
</li>
</ul>
</div>
You can try an alternate to get data value. Use attr
var filt = $filterLinksChildren.attr('data-filter');
I have an unordered list which values are generated from a database using php and mysql.
<div id="articles">
<ul>
<?php foreach ($articles as article) { ?>
<li> <?php echo $article['name']; ?> </li>
<?php } ?>
</ul>
</div>
I'd like to use jQuery to add a css class to every item in that list except the last one
//then you can select all `li` elements under `#articles` except the last one like
jQuery(function($) {
$('#articles li:not(:last)').addClass('myclass')
})
.myclass {
background-color: lightgrey;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="articles">
<ul>
<li>1</li>
<li>2</li>
<li>3</li>
</ul>
</div>
You can do it with css only
#articles li {
background-color: lightgrey;
}
#articles li:last-child {
background-color: white;
}
<div id="articles">
<ul>
<li>1</li>
<li>2</li>
<li>3</li>
</ul>
</div>
<div id="articles">
<ul>
<?php
$count =count($articles);
foreach ($articles as article) {
$counter++;
If($count==$counter)
$class='something';
Else
$class='';
?>
<li> <?php echo $article['name']; ?> </li>
<?php
}
?>
</ul>
</div>
Use class variable in li now.
You can achieve same thing using PHP also by adding one more condition in your code.
foreach ($articles as $article) {
if(end($articles) == $article) {
?>
<li> <?php echo $article['name']; ?> </li>
<?php
}
else{ ?>
<li class="myclass"> <?php echo $article['name']; ?> </li>
<?php
}
}
My problem is that I am trying to create a javascript menu but the script seems to be loading really slow and late so it's not working on the first seconds. Correct me if I am wrong.
Second, I don't manage to make each column to work well and sometimes it's just linking to the same page, no matter which option I choose as well to another problem that there is no reaction to my choice, like I didn't do anything even if I really chose something from the menu.
Do you know what can be the problem? Is it a bad idea to do it with JavaScript? Would you make it with PHP? I also thing that the code is maybe too long.
This is the example for my problem - link
<div class="quick_width">
<div class="quick_links"><img src="http://www.101greatgoals.com/wp-content/themes/tutorial/images/quick_links.jpg" width="102" height="37" alt=" "></div>
<div class="green_bg">
<div class="option_width">
<div class="form_row_name_input1">
<ul class="dropdownul">
<li id="categories">
<?php wp_dropdown_categories('show_option_none=Country'); ?>
<script type="text/javascript"><!--
var dropdown = document.getElementById("cat");
function onCatChange() {
if ( dropdown.options[dropdown.selectedIndex].value > 0 ) {
location.href = "<?php echo get_option('home');
?>/category/goals/"+dropdown.options[dropdown.selectedIndex].text.split(' ').join('-');
}
}
dropdown.onchange = onCatChange;
--></script>
</li>
</ul>
</div>
<div class="form_row_name_input1">
<ul class="dropdownul">
<li id="categories">
<?php wp_dropdown_categories('taxonomy=teams&show_option_none=Teams&name=teamsmenu'); ?>
<script type="text/javascript"><!--
var dropdown = document.getElementById("teamsmenu");
function onCatChange() {
if ( dropdown.options[dropdown.selectedIndex].value > 0 ) {
location.href = "<?php echo get_option('home');
?>/?teams="+dropdown.options[dropdown.selectedIndex].text.split(' ').join('-');
}
}
dropdown.onchange = onCatChange;
--></script>
</li>
</ul>
</div>
<div class="form_row_name_input1">
<ul class="dropdownul">
<li id="categories">
<?php wp_dropdown_categories('taxonomy=players&show_option_none=Players&name=playersmenu'); ?>
<script type="text/javascript"><!--
var dropdown = document.getElementById("playersmenu");
function onCatChange() {
if ( dropdown.options[dropdown.selectedIndex].value > 0 ) {
location.href = "<?php echo get_option('home');
?>/?players="+dropdown.options[dropdown.selectedIndex].text.split(' ').join('-');
}
}
dropdown.onchange = onCatChange;
--></script>
</li>
</ul>
</div>
<div class="form_row_name_input1">
<ul class="dropdownul">
<li id="categories">
<?php wp_dropdown_categories('taxonomy=managers&show_option_none=Managers&name=managersmenu'); ?>
<script type="text/javascript"><!--
var dropdown = document.getElementById("managersmenu");
function onCatChange() {
if ( dropdown.options[dropdown.selectedIndex].value > 0 ) {
location.href = "<?php echo get_option('home');
?>/?managers="+dropdown.options[dropdown.selectedIndex].text.split(' ').join('-');
}
}
dropdown.onchange = onCatChange;
--></script>
</li>
</ul>
</div>
<div class="form_row_name_input1">
<ul class="dropdownul">
<li id="categories">
<?php wp_dropdown_categories('taxonomy=clean_feeds&show_option_none=Other&name=othermenu'); ?>
<script type="text/javascript"><!--
var dropdown = document.getElementById("othermenu");
function onCatChange() {
if ( dropdown.options[dropdown.selectedIndex].value > 0 ) {
location.href = "<?php echo get_option('home');
?>/?clean_feeds="+dropdown.options[dropdown.selectedIndex].text.split(' ').join('-');
}
}
dropdown.onchange = onCatChange;
--></script>
</li>
</ul>
</div>
</div>
</div>
<div class="right_align"></div>
</div>
In this case, I would definitely recommend creating the HTML output through PHP beforehand. This way, when the page has loaded you can trigger your menu-script.
The example provided in the WordPress reference for the wp_dropdown_categories() function has a cool example which should help you on your way. What it does is basically replace certain parts of the generated HTML. These replacements in your case would then be mainly in the generated URL. Example reproduced here for clarity:
<li id="categories">
<h2><?php _e('Posts by Category'); ?></h2>
<form action="<?php bloginfo('url'); ?>/" method="get">
<div>
<?php
$select = wp_dropdown_categories('show_option_none=Select category&show_count=1&orderby=name&echo=0');
$select = preg_replace("#<select([^>]*)>#", "<select$1 onchange='return this.form.submit()'>", $select);
echo $select;
?>
<noscript><div><input type="submit" value="View" /></div></noscript>
</div></form>
</li>
I've been building a site in PHP, HTML, CSS, and using a healthy dose of jQuery javascript. The site looks absolutely fine on my Mac browsers, but for some reason, when my client uses PC Safari, she's seeing strange bits of my HTML show up on the page.
Here are some (small) screenshot examples:
Figure 1: This one is just a closing </li> tag that should've been on the Media li element. Not much harm done, but strange.
Figure 2: Here this was part of <div class='submenu'> and since the div tag didn't render properly, the entire contents of that div don't get styled correctly by CSS.
// picture removed for security reasons
Figure 3: This last example shows what should have been <a class='top current' href=... but for some reason half of the HTML tag stops being rendered and just gets printed out. So the rest of that list menu is completely broken.
Here's the code from the header.php file itself. The main navigation section (seen in the screenshots) is further down, marked by a line of asterisks if you want to skip there.
<?php
// Setting up location variables
if(isset($_GET['page'])) { $page = Page::find_by_slug($_GET['page']); }
elseif(isset($_GET['post'])) { $page = Page::find_by_id(4); }
else { $page = Page::find_by_id(1); }
$post = isset($_GET['post']) ? Blogpost::find_by_slug($_GET['post']) : false;
$front = $page->id == 1 ? true : false;
$buildblog = $page->id == 4 ? true : false;
$eventpage = $page->id == 42 ? true : false;
// Setting up content edit variables
$edit = isset($_GET['edit']) ? true : false;
$preview = isset($_GET['preview']) ? true : false;
// Finding page slug value
$pageslug = $page->get_slug($loggedIn);
?>
<!DOCTYPE html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>
<?php
if(!$post) {
if($page->id != 1) {
echo $page->title." | ";
}
echo $database->site_name();
}
elseif($post) {
echo "BuildBlog | ".$post->title;
}
?>
</title>
<link href="<?php echo SITE_URL; ?>/styles/style.css" media="all" rel="stylesheet" />
<?php include(SITE_ROOT."/scripts/myJS.php"); ?>
</head>
<body class="
<?php
if($loggedIn) { echo "logged"; } else { echo "public"; }
if($front) { echo " front"; }
?>">
<?php $previewslug = str_replace("&edit", "", $pageslug); ?>
<?php if($edit) { echo "<form id='editPageForm' action='?page={$previewslug}&preview' method='post'>"; } ?>
<?php if($edit && !$preview) : // Edit original ?>
<div id="admin_meta_nav" class="admin_meta_nav">
<ul class="center nolist">
<li class="title">Edit</li>
<li class="cancel"><a class="cancel" href="?page=<?php echo $pageslug; ?>&cancel">Cancel</a></li>
<li class="save"><input style='position: relative; z-index: 500' class='save' type="submit" name="newpreview" value="Preview" /></li>
<li class="publish"><input style='position: relative; z-index: 500' class='publish button' type="submit" name="publishPreview" value="Publish" /></li>
</ul>
</div>
<?php elseif($preview && !$edit) : // Preview your edits ?>
<div id="admin_meta_nav" class="admin_meta_nav">
<ul class="center nolist">
<li class="title">Preview</li>
<li class="cancel"><a class="cancel" href="?page=<?php echo $pageslug; ?>&cancel">Cancel</a></li>
<li class="save"><a class="newpreview" href="?page=<?php echo $pageslug; ?>&preview&edit">Continue Editing</a></li>
<li class="publish"><a class="publish" href="?page=<?php echo $pageslug; ?>&publishLastPreview">Publish</a></li>
</ul>
</div>
<?php elseif($preview && $edit) : // Return to preview and continue editing ?>
<div id="admin_meta_nav" class="admin_meta_nav">
<ul class="center nolist">
<li class="title">Edit Again</li>
<li class="cancel"><a class="cancel" href="?page=<?php echo $pageslug; ?>&cancel">Cancel</a></li>
<li class="save"><input style='position: relative; z-index: 500' class='save button' type="submit" name="newpreview" value="Preview" /></li>
<li class="publish"><input style='position: relative; z-index: 500' class='publish button' type="submit" name="publishPreview" value="Publish" /></li>
</ul>
</div>
<?php else : ?>
<div id="meta_nav" class="meta_nav">
<ul class="center nolist">
<li>Logout</li>
<li>Admin</li>
<li><a href="<?php
if($front) {
echo "admin/?admin=frontpage";
} elseif($event || $eventpage) {
echo "admin/?admin=events";
} elseif($buildblog) {
if($post) {
echo "admin/editpost.php?post={$post->id}";
} else {
echo "admin/?admin=blog";
}
} else {
echo "?page=".$pageslug."&edit";
}
?>">Edit Mode</a></li>
<li>Donate</li>
<li>Calendar</li>
</ul>
<div class="clear"></div>
</div>
<?php endif; ?>
<div id="public_meta_nav" class="public_meta_nav">
<div class="center">
<ul class="nolist">
<li>Donate</li>
<li>Calendar</li>
</ul>
<div class="clear"></div>
</div>
</div>
******* Main Navigation Section, as seen in screenshots above, starts here ********
<div class="header">
<div class="center">
<a class="front_logo" href="<?php echo SITE_URL; ?>"><?php echo $database->site_name(); ?></a>
<ul class="nolist main_nav">
<?php
$tops = Page::get_top_pages();
$topcount = 1;
foreach($tops as $top) {
$current = $top->id == $topID ? true : false;
$title = $top->title == "Front Page" ? "Home" : ucwords($top->title);
$url = ($top->title == "Front Page" || !$top->get_slug($loggedIn)) ? SITE_URL : SITE_URL . "/?page=".$top->get_slug($loggedIn);
if(isset($_GET['post']) && $top->id == 1) {
$current = false;
}
if(isset($_GET['post']) && $top->id == 4) {
$current = true;
}
echo "<li";
if($topcount > 3) { echo " class='right'"; }
echo "><a class='top";
if($current) { echo " current"; }
echo "' href='{$url}'>{$title}</a>";
if($children = Page::get_children($top->id)) {
echo "<div class='submenu'>";
echo "<div class='corner-helper'></div>";
foreach($children as $child) {
echo "<ul class='nolist level1";
if(!$subchildren = Page::get_children($child->id)) {
echo " nochildren";
}
echo "'>";
$title = ucwords($child->title);
$url = !$child->get_slug($loggedIn) ? SITE_URL : SITE_URL . "/?page=".$child->get_slug($loggedIn);
if($child->has_published() || $loggedIn) {
echo "<li><a class='title' href='{$url}'>{$title}</a>";
if($subchildren = Page::get_children($child->id)) {
echo "<ul class='nolist level2'>";
foreach($subchildren as $subchild) {
if($subchild->has_published() || $loggedIn) {
$title = ucwords($subchild->title);
$url = !$subchild->get_slug($loggedIn) ? SITE_URL : SITE_URL . "/?page=".$subchild->get_slug($loggedIn);
echo "<li><a href='{$url}'>{$title}</a>";
}
}
echo "</ul>";
}
echo "</li>";
}
echo "</ul>";
}
echo "</div>";
}
echo "</li>";
$topcount++;
}
?>
</ul>
<div class="clear"></div>
</div>
</div>
<div id="mediaLibraryPopup" class="mediaLibraryPopup">
<h3>Media Library</h3>
<ul class="box nolist"></ul>
<div class="clear"></div>
Cancel
</div>
<div class="main_content">
Does anyone have any idea why the PC Safari browser would be breaking things up like this? I'm assuming it's PHP related but I cannot figure out why it would do that.
Here is the View Source version of the served HTML, as requested: (the IP has been obscured FYI)
<!DOCTYPE html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Become An Advocate | Habitat for Humanity</title>
<link href="http://28.5.337.28/~habiall2/styles/style.css" media="all" rel="stylesheet" />
<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js'></script>
<script src='http://ajax.googleapis.com/ajax/libs/jqueryui/1.7.2/jquery-ui.min.js'></script>
<script src='http://28.5.337.28/~habiall2/scripts/tiny_mce.js'></script>
<script src='http://28.5.337.28/~habiall2/scripts/jquery.easing.js'></script>
<script src='http://28.5.337.28/~habiall2/scripts/cufon.js'></script>
<script src='http://28.5.337.28/~habiall2/scripts/helvetica_condensed.js'></script>
<script>
Cufon.replace('#feature_boxes .heading', { hover: true });
Cufon.replace('#feature_boxes .button', { hover: true });
</script>
<script src='http://28.5.337.28/~habiall2/scripts/front_public.js'></script><script src='http://28.5.337.28/~habiall2/scripts/front_admin.js'></script><script src='http://28.5.337.28/~habiall2/scripts/jquery.cycle.js'></script>
<script >
$('#feature_boxes').cycle({
fx: 'fade',
timeout: 8000,
speed: 500,
easing: 'easeInCubic',
pager: '.feature_pager'
});
</script>
</head>
<body class="
public">
<div id="meta_nav" class="meta_nav">
<ul class="center nolist">
<li>Logout</li>
<li>Admin</li>
<li>Edit Mode</li>
<li>Donate</li>
<li>Calendar</li>
</ul>
<div class="clear"></div>
</div>
<div id="public_meta_nav" class="public_meta_nav">
<div class="center">
<ul class="nolist">
<li>Donate</li>
<li>Calendar</li>
</ul>
<div class="clear"></div>
</div>
</div>
<div class="header">
<div class="center">
<a class="front_logo" href="http://28.5.337.28/~habiall2">Habitat for Humanity</a>
<ul class="nolist main_nav">
<li><a class='top' href='http://28.5.337.28/~habiall2'>Home</a></li>
<li><a class='top' href='http://28.5.337.28/~habiall2/?page=about'>About</a>
<div class='submenu'><div class='corner-helper'></div>
<ul class='nolist level1'>
<li><a class='title' href='http://28.5.337.28/~habiall2/?page=about-us'>About Us</a>
<ul class='nolist level2'>
<li><a href='http://28.5.337.28/~habiall2/?page=mission-and-vision'>Mission And Vision</a>
<li><a href='http://28.5.337.28/~habiall2/?page=history'>History</a>
<li><a href='http://28.5.337.28/~habiall2/?page=staff-and-board'>Staff And Board</a>
<li><a href='http://28.5.337.28/~habiall2/?page=jobs-and-internships'>Jobs And Internships</a>
<li><a href='http://28.5.337.28/~habiall2/?page=directions'>Directions</a>
<li><a href='http://28.5.337.28/~habiall2/?page=annual-report'>Annual Report</a>
</ul>
</li>
</ul>
<ul class='nolist level1'>
<li><a class='title' href='http://28.5.337.28/~habiall2/?page=our-stories'>Our Stories</a>
<ul class='nolist level2'><li><a href='http://28.5.337.28/~habiall2/?page=homeowner-profiles'>Homeowner Profiles</a>
<li><a href='http://28.5.337.28/~habiall2/?page=volunteer-profiles'>Volunteer Profiles</a>
<li><a href='http://28.5.337.28/~habiall2/?page=partner-profiles'>Corporate Profiles</a>
<li><a href='http://28.5.337.28/~habiall2/?page=community-profiles'>Community Profiles</a>
</ul>
</li>
</ul>
<ul class='nolist level1 nochildren'>
<li><a class='title' href='http://28.5.337.28/~habiall2/?page=calendar'>Calendar</a></li>
</ul>
</div>
</li>
<li><a class='top current' href='http://28.5.337.28/~habiall2/?page=get-involved'>Get Involved</a>
<div class='submenu'><div class='corner-helper'></div>
<ul class='nolist level1'>
<li><a class='title' href='http://28.5.337.28/~habiall2/?page=construction volunteer'>Volunteer</a>
<ul class='nolist level2'>
<li><a href='http://28.5.337.28/~habiall2/?page=Construction'>Construction</a>
<li><a href='http://28.5.337.28/~habiall2/?page=non-construction volunteer'>Non-Construction </a>
<li><a href='http://28.5.337.28/~habiall2/?page=faith-programs'>Faith Programs</a>
<li><a href='http://28.5.337.28/~habiall2/?page=youth-programs'>Youth Programs</a>
<li><a href='http://28.5.337.28/~habiall2/?page=forms-and-info'>Forms And Info</a>
<li><a href='http://28.5.337.28/~habiall2/?page=AmeriCorps'>AmeriCorps</a>
</ul>
</li>
</ul>
<ul class='nolist level1'>
<li><a class='title' href='http://28.5.337.28/~habiall2/?page=advocate-1'>Advocate</a>
<ul class='nolist level2'>
<li><a href='http://28.5.337.28/~habiall2/?page=become-an-advocate'>What Is Advocacy?</a>
<li><a href='http://28.5.337.28/~habiall2/?page=what-is-advocacy'>Become An Advocate</a>
</ul>
</li>
</ul>
<ul class='nolist level1'>
<li><a class='title' href='http://28.5.337.28/~habiall2/?page=donate-1-2'>Donate</a>
<ul class='nolist level2'>
<li><a href='http://28.5.337.28/~habiall2/?page=one-time-donation'>One-time Donations</a>
<li><a href='http://28.5.337.28/~habiall2/?page=corporate-donations'>Corporate Donations</a>
<li><a href='http://28.5.337.28/~habiall2/?page=ReStore'>ReStore</a>
<li><a href='http://28.5.337.28/~habiall2/?page=vehicle-donation'>Other Ways To Donate</a>
<li><a href='http://28.5.337.28/~habiall2/?page=item-wishlist'>Item Wishlist</a>
</ul>
</li>
</ul>
</div>
</li>
<li class='right'><a class='top' href='http://28.5.337.28/~habiall2/?page=apply'>Apply</a>
<div class='submenu'><div class='corner-helper'></div>
<ul class='nolist level1 nochildren'>
<li><a class='title' href='http://28.5.337.28/~habiall2/?page=process'>Requirements</a></li>
</ul>
<ul class='nolist level1 nochildren'>
<li><a class='title' href='http://28.5.337.28/~habiall2/?page=requirements'>Income Guidelines</a></li>
</ul>
<ul class='nolist level1 nochildren'>
<li><a class='title' href='http://28.5.337.28/~habiall2/?page=Local-Assistance-'>Local Assistance </a></li>
</ul>
</div>
</li>
<li class='right'><a class='top' href='http://28.5.337.28/~habiall2/?page=blog'>BuildBlog</a></li>
<li class='right'><a class='top' href='http://28.5.337.28/~habiall2/?page=media'>Media</a>
<div class='submenu'><div class='corner-helper'></div>
<ul class='nolist level1 nochildren'>
<li><a class='title' href='http://28.5.337.28/~habiall2/?page=presskit'>Presskit</a></li>
</ul>
<ul class='nolist level1 nochildren'>
<li><a class='title' href='http://28.5.337.28/~habiall2/?page=media-gallery'>Media Gallery</a></li>
</ul>
</div>
</li>
</ul>
<div class="clear"></div>
</div>
</div>
<div id="mediaLibraryPopup" class="mediaLibraryPopup">
<h3>Media Library</h3>
<ul class="box nolist"></ul>
<div class="clear"></div>
Cancel
</div>
PHP will never produce any differences across browsers (unless you work at making it do so). It's compiled serverside, so the only thing that the browser sees is the the HTML/CSS/Javascript.
You absolutely need to generate valid HTML with a proper DOCTYPE to be rendered by browsers in standards mode. When you don't, browsers try to fix the errors they find the best of their ability. While there's (supposedly) only one standard way to display valid HTML, there're no rules to handle invalid HTML because the variety of possible errors is infinite. Broken HTML (aka tag soup) is subject to way more cross-browser differences.
Now, the mere fact that you've included PHP as first suspect suggests that you don't have a clear idea of how web technologies work and interact. It's alright (we all have to start learning somewhere) but you should know that PHP is a server-side language. It can generate HTML (and CSS, JavaScript or even pictures) but browser only receive its output. When your page looks bad, resort to your browser's View Source menu as your first debugging tool.
Update
You can use this: http://validator.w3.org/#validate_by_input
Your HTML triggers 55 errors (however, it's likely that they all have the same source). It's also a good idea to validate CSS.
I validated your HTML, and only three things came up: You have two links with spaces in them: <li><a class='title' href='http://28.5.337.28/~habiall2/?page=construction volunteer'>Volunteer</a><li> and <li><a href='http://28.5.337.28/~habiall2/?page=non-construction volunteer'>Non-Construction </a>
and somewhere you used an ampersand instead of & which is minor, but I suppose could be causing the problem. I also can't get the page to render incorrectly in Chromium or Firefox, but then I don't have CSS or JS. Is it possible one of you Javascript deals is gumming up the works? Try removing all your JS and see if the error is still there.
Looking at the html you are missing the "<html>" tag in the header it should appear right after the doctype. I would imagine that that's important in preventing parsing errors.
Like Alvaro suggested, you need to make sure it's valid for the best cross browser compatibility.
Use W3C's validator: http://validator.w3.org/ to validate your html