Don't use blinking text; it's terrible for usability. The
BLINK element was originally a bad joke. Read on for solutions to the problems with the sample code not to fix blinking text but to fix your skills.
Note the generated HTML content:
HTML:
<script type="text/javascript">blinkFont(blinkThis);</script>
<a id="blinkThis" href="CompSummary.php">0</a>
Take a look at your error console and you'll see the problem (well, two problems) with this.
If that's a representative sample of MP3COMPETEjs.php, then you're "header" call is in a JS region, not PHP.
The MIME type for JS is "
application/javascript". IE ≤ 8 has problems with this MIME type in "type" attributes, but not with the Content-type header. IE may have problems with the "php" extension. To fix this, use clean URLs (based on rewrite rules or
content negotiation; web and forum searches will turn up specifics) to hide the "php" extension.
Note in
blinkFont and
setblinkFont you're getting the element with the ID of
"obj", rather than the ID stored in variable
obj, due to the quotes.
setTimeout evaluates strings in global context. The
obj you want to pass to
blinkFont and
setblinkFont is a local variable, not a global variable, so a string argument won't work. For this reason (among others), it's better to pass a function rather than a string to
setTimeout and its cousin,
setInterval.
MP3COMPETE.js.php:
PHP:
<?php header("Content-type: application/javascript"); ?>
//-----------blinking text
function blinkFont(obj) {
// note obj, not "obj"
document.getElementById(obj).style.color="red";
// You can pass a function rather than a string.
setTimeout(function () {setblinkFont(obj);}, 1000);
}
function setblinkFont(obj) {
document.getElementById(obj).style.color="<?PHP echo $color; ?>";
setTimeout(function () {blinkFont(obj)}, 1000);
}
// alternate implementation
function blinkFont(obj) {
var elt = document.getElementById(obj);
var blinker = function () {
if (elt.style.color == 'red') {
elt.style.color = '<?PHP echo $color; ?>';
} else {
elt.style.color = 'red';
}
}
return setInterval(blinker, 1000);
}
//----------end blinking text
HTML:
<!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>
<script type="text/javascript" src="../script/MP3COMPETE.js"></script>
</head>
<body>
<?php
//For easier understanding, lets set $values and $color here.
//Though the whole reason i need to do this is because
//$values and $color are dynamic and based on
//data retrieved from a MySQL database.
$values = 0;
$color = '#0033FF';
# Note the following still has two bugs.
if(time() - $values > 147600) { ?>
<script type="text/javascript">blinkFont(blinkThis);</script>
<a id="blinkThis" href="CompSummary.php"><?php echo $values ?></a>
<?php }
?>
</body>
</html>
As always, questions like this should include a link to a live page. Use
PHP:
or [html] tags over [code] when appropriate. You'll get syntax hilighting that can reveal typos. Code should be [URL="http://en.wikipedia.org/wiki/Indent_style"]indented[/URL] for readability.
