We Keep Coding

adding simple countdown (as numbers) to my php script

i have php page that i want to run simple countdown 60 seconds in a certain area of my page (in the footer) because i have auto refresh code to refresh the page every 60 seconds so i want to show to users that 60, 59, 58, 57.... just a text rolling countdown until it refreshes so it will start again. easy and simple, no need for complete count down scripts as shown online in many sites...
what i could think is a gif animated small icon, that can work but if possible not add an image is better, i just want normal size text as numbers running from 60 to 0 then looping again (even if no looping is fine... page will be refreshed anyway)
what to do?

You cannot do this with PHP since it is server side . You can create using javascript. Please try this code:
<div id="timer">##</div>
<button id="starter" onclick="start('60');">start</button>
<script>
var tme = document.getElementById("timer");
var bt= document.getElementById("starter");
var counting = false;
function start(count) {
//console.log(counting);
if (!counting) {
counting = true;
tme.innerHTML = count;
var timer = setInterval(function() {
if (count >= 0) {
tme.innerHTML = count;
count--;
} else {
clearInterval(timer);
count = arguments[0];
counting = false;
}
}, 400);
}
}
</script>
Hope this will help

Javascript Calculation function - Not calculating in html

I am having an issue implementing this calculator on my website which i created. I think i have used the wrong javascript to create the simple calculation which is the following math calculation: ((list price - rrp) / list price) * 100
PLEASE NOTE, i am aware of the values not being numbers, please replace them with any numbers. it still doesnt work.
This is to get the percentage value of the discount against the list and the RRP.
Please review the code before HTML:
<script type="text/javascript">
discountFinal(#OriginalPrice, #ListPrice);
</script>
<div id="discountCode">
<span id="spanish"></span>
<span id="spanishtwo">%</span>
</div>
Javascript:
var discountFinal = function (firstly, secondly) {
var totalfirst = secondly - firstly;
var totalsecond = totalfirst / secondly;
var totalthird = totalsecond * 100;
if (document.getElementById("discountCode").innerHTML === null) {
document.getElementById("spanishtwo").innerHTML.replace("%", "")
} else {
document.getElementById("spanish").innerHTML = Math.floor(totalthird / 5) * 5
}
};
I dont think i am calling the function within the html properly. Can someone assist with this please.
http://jsfiddle.net/xwzhY/

I'm not sure the error you're getting, but it seems as if you're calling the discountFinal function before it's defined. When you move the call, it starts to work:
http://jsfiddle.net/bmonty/xwzhY/4/
Edit after comment from OP.
You just need to make sure your discountFinal function is defined at the top of your page, before any place it gets called.
This will work:
<script type="text/javascript">
var discountFinal = function(a, b){};
</script>
<script type="text/javascript">
var result = discountFinal(1, 2);
</script>
But this will throw an error:
<script type="text/javascript">
var result = discountFinal(1, 2);
</script>
<script type="text/javascript">
var discountFinal = function(a, b){};
</script>
To get some clarification, View Source on the HTML page from your browser to see what the resulting page looks like. That should point out where the order of operations is getting messed up.

It works fine if you call your function after it exists: http://jsfiddle.net/xwzhY/2/
Just make sure that the function is declared earlier in the code than you use it. Or declare it using a function statement rather than a function expression assigned to a variable:
function discountFinal(firstly, secondly){
...

Trying put "" around your perl variable, you need to pass the value

Javascript Page Load Total

I've created a form that is used to calculate monthly expenses. The problem I'm having is on the last page I'm gathering information from previous pages (session to data) that auto fills the fields on the last page. I've created a Javascript that is suppose to subtract the five fields on the page for a grand total but this doesn't work. If I delete the session to data from the load section the Javascript works perfectly.
Page in Question:
http://www.garranteedsolutions.com/budget?chronoform=BudgetPage7
Javascript:
window.addEvent('domready', function() {
$('spendable').addEvent('change', rekenen1);
$('housetotal').addEvent('change', rekenen1);
$('cartotal').addEvent('change', rekenen1);
$('creditortotal').addEvent('change', rekenen1);
$('misctotal').addEvent('change', rekenen1);
});
function rekenen1(){
$('grandtotal').value = Number($('spendable').value) + Number($('housetotal').value) + Number($('cartotal').value) + Number($('creditortotal').value) + Number($('misctotal').value) ;
}
This is the code that I had been using but it requires a change in the form box to perform the action. I've tried this
Javascript:
window.addEvent('domready', function() {
rekenen1;
$('spendable').addEvent(rekenen1);
$('housetotal').addEvent(rekenen1);
$('cartotal').addEvent(rekenen1);
$('creditortotal').addEvent(rekenen1);
$('misctotal').addEvent(rekenen1);
});
function rekenen1(){
$('grandtotal').value =
Number($('spendable').value) + Number($('housetotal').value)
+ Number($('cartotal').value) + Number($('creditortotal').value)
+ Number($('misctotal').value);
}
This is a continuation of me searching for help starting here: http://www.chronoengine.com/forums/viewtopic.php?f=2&t=67427&p=269741#p269741
I don't know Javascript very well and I'm so close to having this form completed. I just can't get the Grand Total to tally up.

The problem is that the events are only firing when you change the values of the form. The form its readonly so they cannot be changed.
Anyway, here is the code optimized:
window.addEvent('domready', function() {
var rekenen1 = function(){
var grandTotal = 0;
$$('#spendable, #housetotal, #cartotal, #creditortotal, #misctotal').each(function(el){
if(el.value.length > 0) grandTotal += el.value.toFloat();
});
$('grandtotal').value = grandTotal;
};
$$('#spendable, #housetotal, #cartotal, #creditortotal, #misctotal').addEvent('onchange', refenen1);
});
That should work. The function checks if the fields have value on them and if they have, they are included in the calculation.
The second code you made fires the error because you are missing a parameter in the addEvent function.
I hope that this can help you :)

This seemed to work! So now I'm trying to figure out how to get commas for the thousands. So if I input 1200 it displays 1,200.
window.addEvent('domready', function() {
$('grandtotal').value = Number($('spendable').value) + Number($('housetotal').value) + Number($('cartotal').value) + Number($('creditortotal').value) + Number($('misctotal').value);
});
Thank you so much for your help!

Randomly fade <div>s

Basically I'm trying to merge the two scripts below for a project. My goal is to keep the functionality of the first link, where it fades in random divs at different intervals, but attach it to PaulPRO's version, in that it keeps looping over and over again, say every 5 seconds. Any help is greatly appreciated!
http://jsfiddle.net/cMQdj/1/ (thanks to mblase75)
http://jsfiddle.net/Paulpro/G4pxq/ (thanks to PaulPRO)

Hows this ->
http://jsfiddle.net/G4pxq/9/
(function fadeInDiv(){
var divs = $('.fadeIn');
var elem = divs.eq(Math.floor(Math.random()*divs.length));
if (!elem.is(':visible')){
elem.fadeIn(Math.floor(Math.random()*1000),fadeInDiv);
} else {
elem.fadeOut(Math.floor(Math.random()*1000),fadeInDiv);
}
})();
Update
Maintaining position / order :
http://jsfiddle.net/G4pxq/12/
$('.fadeIn').before('<div> </div>');
(function fadeInDiv() {
var divs = $('.fadeIn');
var elem = divs.eq(Math.floor(Math.random() * divs.length));
if (!elem.is(':visible')) {
elem.prev().remove();
elem.fadeIn(Math.floor(Math.random() * 1000), fadeInDiv);
} else {
elem.fadeOut(Math.floor(Math.random() * 1000), function() {
elem.before('<div> </div>');
fadeInDiv();
});
}
})();

I think you have your examples reversed.
If you want to loop Paul's example, just surround his code in a setInterval method.
setInterval($('.fadeIn').before('<div> </div>'), 2000);

Hyperlink to random HTML page

I have a selection of HTML pages (Lets say 30) and I want to have a randomise button, so that when the button is pressed, it displays one of the 30 pages randomly.
Ive found several scripts around the net that seem to do the trick, however they seem a bit 'hacky' and was wondering what the simplest, cleanest solution to this is?
Thanks in advance!

if var arr was your array you could get a random value using this :
var value = arr[Math.floor(Math.random() * arr.length)];
This generates a random number between 0 and the length of your array.
You can then navigate to that url ...
window.location = value;
Update
Simple demo : http://jsfiddle.net/ESSAc/1/
Added a simple onclick attribute to a button :
<input type="button" onclick="runme()" value="Click Me!" />
to execute this function :
function runme() {
var arr = ["http://www.bbc.co.uk/", "http://www.yahoo.com/", "http://www.stackoverflow.com/"];
var value = arr[Math.floor(Math.random() * arr.length)];
alert("Would navigate to : " + value);
// window.location = value; // remove the comment at the beginning to actually navigate
}

I don't know if it's 'hacky' or not, but I'd do it this way:
jQuery('#sumfin').onclick( function() {
jQuery.get(
'someurlthatreturnsjsonwitharandomurl.php',
{},
function (data) {
window.location = data.url;
},
'json'
);
}
Then just have an array of pages in a server-side script.