UPDATE:
I’m making a like/dislike voting program and it has worked the way I want it in Firefox 3, Chrome, and Safari. However, it doesn’t seem to be working in Firefox 4. For example, I’ve made a form such that after the user clicks the submit button and the data is sent into the SQL table, a jquery animation is supposed to play. This is the full code:
<script type="text/javascript" src="opacity.js"></script>
<link href="voter.css" rel="stylesheet" type="text/css" />
<?php
mysql_connect("","","") or die("Error connecting to db");
mysql_select_db("") or die("Error connecting to db");
$currAdd2 = $_SERVER["REQUEST_URI"];
$currAdd2 = substr($currAdd2, 0, -9);
$currAdd2 = substr($currAdd2, 11);
$numrow1 = mysql_query("SELECT * FROM rate WHERE apt = '$currAdd2' AND likes = 1 ");
$numlikes = mysql_num_rows($numrow1);
$numrow2 = mysql_query("SELECT * FROM rate WHERE apt = '$currAdd2' AND likes = 0 ");
$numdislikes = mysql_num_rows($numrow2);
$numrow3 = mysql_query("SELECT * FROM rate WHERE apt = '$currAdd2' ");
$totalvotes = mysql_num_rows($numrow3);
$likewidth = ($numlikes/($totalvotes+1)) * 400;
$dislikewidth = ($numdislikes/($totalvotes+1)) * 400;
?>
<form action= '<?php echo $_SERVER['PHP_SELF']; ?>'; method='post'>
<table align='left' width='500px' border='0' cellpadding='0' cellspacing='0'>
<? echo"
<tr>
<td>
<div id='blue'><input type='image' name='blue' id='likebutton' value='blue' src='../zrating/like.png'
/></div>
</td>
<td>
<b>$numlikes Like</b>
<div id='like' style='width:$likewidth'><div id='dis'></div></div><br>
</td>
</tr>
<tr>
<td>
<div id='red'><input type='image' name='red' id='dislikebutton' value='red' src='../zrating/dislike.png'
/></div>
</td>
<td>
<b>$numdislikes Dislike</b>
<div id='dislike' style='width:$dislikewidth'><div id='dis'></div></div><br>
</td>
</tr>
<tr>
<td>
</td>
<td>
<div id='success'><br><br>Thanks for voting!</div>
<div id='fail'><br><br>You are only allowed 1 vote per apartment.</div>
</td>
</tr>
</table>
</form>
";
//check ip address
if (!empty($_SERVER['HTTP_CLIENT_IP'])) //check ip from share internet
{
$ip=$_SERVER['HTTP_CLIENT_IP'];
}
elseif (!empty($_SERVER['HTTP_X_FORWARDED_FOR'])) //to check ip is pass from proxy
{
$ip=$_SERVER['HTTP_X_FORWARDED_FOR'];
}
else
{
$ip=$_SERVER['REMOTE_ADDR'];
}
if ( isset( $_POST['blue'] ) )
{
$currAdd = $_SERVER["REQUEST_URI"];
$currAdd = substr($currAdd, 0, -9);
$currAdd = substr($currAdd, 11);
$ipquery = mysql_query ("SELECT * FROM rate WHERE ip = '$ip' AND apt = '$currAdd' ");
$ipquery = mysql_fetch_assoc($ipquery);
$ipquery = $ipquery['ip'];
if ($ipquery == $ip)
{
echo "<script type='text/javascript' src='jquery.js'></script>";
echo "<script type='text/javascript'>
$(document).ready(function()
{
$('#fail').animate({width:300},1000);
$('#fail').animate({height:100},1000);
$('#fail').animate({width:300,height:100},1400);
$('#fail').fadeOut(5000);
}); </script>";
}
else
{
mysql_query ("INSERT INTO rate VALUES ('','$currAdd', '1', '$ip')");
$rankqry = mysql_query ("SELECT * FROM rank WHERE apt = '$currAdd' ");
$rankqry = mysql_fetch_assoc($rankqry);
$rankqry = $rankqry['rank'];
$rankupdate = $rankqry + 1;
if($rankupdate < 0)
{
$rankupdate = 0;
}
mysql_query ("UPDATE rank SET rank = '$rankupdate' WHERE apt = '$currAdd' ");
$likesqry = mysql_query ("SELECT * FROM rank WHERE apt = '$currAdd' ");
$likesqry = mysql_fetch_assoc($likesqry);
$likesqry = $likesqry['likes'];
$likesupdate = $likesqry +1;
mysql_query ("UPDATE rank SET likes = '$likesupdate' WHERE apt = '$currAdd' ");
echo "<script type='text/javascript' src='jquery.js'></script>";
echo "<script type='text/javascript'>
$(document).ready(function()
{
$('#success').animate({width:300},1000);
$('#success').animate({height:100},1000);
$('#success').animate({width:300,height:100},1400);
$('#success').fadeOut(5000);
}); </script>";
}
}
if ( isset( $_POST['red'] ) )
{
$currAdd = $_SERVER["REQUEST_URI"];
$currAdd = substr($currAdd, 0, -9);
$currAdd = substr($currAdd, 11);
$ipquery = mysql_query ("SELECT * FROM rate WHERE ip = '$ip' AND apt = '$currAdd' ");
$ipquery = mysql_fetch_assoc($ipquery);
$ipquery = $ipquery['ip'];
if ($ipquery == $ip)
{
echo "<script type='text/javascript' src='jquery.js'></script>";
echo "<script type='text/javascript'>
$(document).ready(function()
{
$('#fail').animate({width:300},1000);
$('#fail').animate({height:100},1000);
$('#fail').animate({width:300,height:100},1400);
$('#fail').fadeOut(5000);
}); </script>";
}
else
{
mysql_query ("INSERT INTO rate VALUES ('','$currAdd', '0', '$ip')");
$rankqry = mysql_query ("SELECT * FROM rank WHERE apt = '$currAdd' ");
$rankqry = mysql_fetch_assoc($rankqry);
$rankqry = $rankqry['rank'];
$rankupdate = $rankqry - 1;
if($rankupdate < 0)
{
$rankupdate = 0;
}
mysql_query ("UPDATE rank SET rank = '$rankupdate' WHERE apt = '$currAdd' ");
$dislikesqry = mysql_query ("SELECT * FROM rank WHERE apt = '$currAdd' ");
$dislikesqry = mysql_fetch_assoc($dislikesqry);
$dislikesqry = $dislikesqry['dislikes'];
$dislikesupdate = $dislikesqry +1;
mysql_query ("UPDATE rank SET dislikes = '$dislikesupdate' WHERE apt = '$currAdd' ");
echo "<script type='text/javascript' src='jquery.js'></script>";
echo "<script type='text/javascript'>
$(document).ready(function()
{
$('#success').animate({width:300},1000);
$('#success').animate({height:100},1000);
$('#success').animate({width:300,height:100},1400);
$('#success').fadeOut(5000);
}); </script>";
}
}
?>
I used version 1.4.2 of the jquery library and the latest version but still no luck. Thanks in advance for the help.
I’m using the latest version of jQuery (1.6.1), and the following code just ran on my server perfectly fine:
EDIT: Here’s a link to my test PHP script
2nd EDIT: I wanted to add something to my answer. Without context, it is hard to tell if this is an issue, but make sure you are loading the jQuery JS file before you make any calls to the jQuery. The animation calls you made can be done outside of the HTML chunk, but it cannot be done before you load the jQuery JS file. For example, this would work:
But this will not:
Using online jQuery 1.6.1 file