Page 1 of 1
HELP..... i need this web app asap
Posted: Tue Jun 10, 2014 1:31 am
by toyo
I need this web app for a class project that i have to submit in two days,,, can any1 plss assist me ?.. this is what the app wil do
The landing Page size should be 800 width X 600 height.
The button should glow (animation?) and be more of 3D or with shadow.
The sentence which says : 12 copies are still available - requires php count down script - meaning when the page load it shows 12 and every 2 seconds it reduces by 1 (without reloading the page) till it hits 1 and than it change to "Download now before it's too late!"
Please use same colors and theme.
if you are willing to help, i will send the images and some other attatchments to you.. thx
Re: HELP..... i need this web app asap
Posted: Tue Jun 10, 2014 3:13 am
by requinix
We won't do your homework. If you need more time, talk to your teacher about turning it in late.
However we're totally fine helping you do it, if you're willing to show what you've done so far. We can answer questions too.
Re: HELP..... i need this web app asap
Posted: Tue Jun 10, 2014 3:40 am
by toyo
ok. I have done the interface design, but my problem is the PHP code that counts down without reloading the page and performs the action"DOWNLOAD NOW B4 ITS TOO LAATE".....
dats the only problem i am having. And i believe this forum is a solution center and i will get help. Thx for your response
Re: HELP..... i need this web app asap
Posted: Tue Jun 10, 2014 6:46 am
by Celauran
the PHP code that counts down without reloading the page
The PHP code that does that is called JavaScript. PHP runs server side. Once the page has rendered, its job is done.
JS timers
Re: HELP..... i need this web app asap
Posted: Tue Jun 10, 2014 7:44 am
by toyo
OK... Celauran, thx..,, i hv been going thru the site you posted, bt seem nt to be able to put the codes together to get what i want......
i want a count down of number from 12 to 0 then either the browser or a pop up window will ask the user to download.. all this will take place after about 20 seconds, after the page loads.. here is what i have done so far:
Code: Select all
<style type="text/css">
.proof {
font-family: Georgia, "Times New Roman", Times, serif;
font-size: 36px;
font-weight: bold;
color: #000;
text-align: center;
}
.make {
font-family: Georgia, "Times New Roman", Times, serif;
font-size: 16px;
font-weight: bold;
color: #02ACC6;
}
.span {
font-family: Georgia, "Times New Roman", Times, serif;
font-size: 36px;
font-weight: bold;
color: #F03;
text-decoration: blink;
}
.span2 {
font-family: Georgia, "Times New Roman", Times, serif;
font-size: 36px;
font-weight: bold;
color: #F03;
}
.currency {
font-family: "Courier New", Courier, monospace;
font-size: 36px;
font-weight: bold;
color: #009;
text-decoration: line-through;
}
body {
background-color: #EDEDED;
}
</style>
<script>
var nIntervId;
function changeColor() {
nIntervId = setInterval(flashText, 500);
}
function flashText() {
var oElem = document.getElementById("my_box");
oElem.style.color = oElem.style.color == "red" ? "blue" : "red";
}
function stopTextColor() {
clearInterval(nIntervId);
}
</script>
</head>
<body onload="setTimeout(function(){alert('Download Now Before Its Too Late')},15000);">
<table width="839" border="0" align="center">
<tr bgcolor="#EDEDED">
<td width="541" height="600"><img src="3D.png" alt="" name="baby" width="541" height="673" id="baby" /></td>
<td width="288"><p class="proof">Is Your Home Babyproofed?</p>
<p class="make">Make your home (and car) completely baby -safe</p>
<p class="make">Hidden house hold dangers for newborns</p>
<p><span class="currency">19$</span> <span class="span">Free</span></p>
<h2><span class="span2">12 </span> <strong>copies are still available</strong></h2>
<p> </p>
<p> </p>
<form id="form1" name="form1" method="post" action="">
</form>
<p> </p></td>
</tr>
<tr bgcolor="#DBDBDA">
<td bgcolor="#EDEDED"><img src="button.png" alt="" name="download" width="489" height="55" id="download" /></td>
<td bgcolor="#EDEDED"> </td>
</tr>
</table>
</body>
</html>
..
Re: HELP..... i need this web app asap
Posted: Tue Jun 10, 2014 8:01 am
by Christopher
What do you need to improve in the code above? Does the 'Download Now Before Its Too Late' alert display correctly?
Re: HELP..... i need this web app asap
Posted: Tue Jun 10, 2014 8:08 am
by toyo
IT displays well, But the "12" in the statement 12 copies left stil remain constant. I want the number to decrease by 1 like lets say after every 2 seconds. And when its 1, the download now window will pop up to prompt the user.. The reduction will be slow and realistic
Re: HELP..... i need this web app asap
Posted: Tue Jun 10, 2014 8:24 am
by Celauran
These functions that you defined in your script block; where are they being called? The number 12 inside your span; how is that being altered?
Re: HELP..... i need this web app asap
Posted: Tue Jun 10, 2014 8:31 am
by toyo
HERE, I DID A QUICK MODIFICATION AND CALLED ALL THE FUNCTIONS.. THX GUYS, YOU HV BEEN OF GREAT HELP. THE ONLY PROBLEM NOW IS HOW TO SLOW IT DOWN.... IT NW COUTS DOWN TILL 1 AND DISPLAYS WHAT I WANT. BT ITS TOO FAST FOR MY PURPOSE
Code: Select all
<!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=utf-8" />
<title>baby zone</title>
<style type="text/css">
.proof {
font-family: "Comic Sans MS", cursive;
font-size: 40px;
font-weight: bold;
color: #000;
text-align: center;
}
.make {
font-family: Georgia, "Times New Roman", Times, serif;
font-size: 18px;
font-weight: bold;
color: #02ACC6;
}
.span {
font-family: Georgia, "Times New Roman", Times, serif;
font-size: 36px;
font-weight: bold;
color: #F03;
text-decoration: blink;
}
.span2 {
font-family: Georgia, "Times New Roman", Times, serif;
font-size: 36px;
font-weight: bold;
color: #F03;
}
.currency {
font-family: "Courier New", Courier, monospace;
font-size: 36px;
font-weight: bold;
color: #009;
text-decoration: line-through;
}
body {
background-color: #EDEDED;
}
</style>
<script type="text/javascript">
window.onload = function() {
/* set your parameters(
number to countdown from,
pause between counts in milliseconds,
function to execute when finished
)
*/
startCountDown(15, 1000, myFunction);
}
function startCountDown(i, p, f) {
// store parameters
var pause = p;
var fn = f;
// make reference to div
var countDownObj = document.getElementById("countDown");
if (countDownObj == null) {
// error
alert("div not found, check your id");
// bail
return;
}
countDownObj.count = function(i) {
// write out count
countDownObj.innerHTML = i;
if (i == 1) {
// execute function
fn();
// stop
return;
}
setTimeout(function() {
// repeat
countDownObj.count(i - 1);
},
pause
);
}
// set it going
countDownObj.count(i);
}
function myFunction() {
alert("Download Now Before Its Too Late");
}
</script>
</head>
<body>
<table width="800" border="0" align="center">
<tr bgcolor="#EDEDED">
<td width="541" height="600"><img src="3D.png" alt="" name="baby" width="541" height="673" id="baby" /></td>
<td width="288"><p class="proof">Is Your Home Babyproofed?</p>
<p class="make">Make your home (and car) completely baby -safe</p>
<p class="make">Hidden house hold dangers for newborns</p>
<p><span class="currency">19$</span> <span class="span">Free</span></p>
<h2><span class="span2"><div id="countDown"></div> </span> <strong>copies are still available</strong></h2>
<p> </p>
<p> </p>
<p><a href="landing.php"><img src="button.png" alt="" name="download" width="343" height="55" id="download" /></a></p></td>
</tr>
<tr bgcolor="#DBDBDA">
<td bgcolor="#EDEDED"> </td>
<td bgcolor="#EDEDED"> </td>
</tr>
</table>
</body>
</html>
Re: HELP..... i need this web app asap
Posted: Tue Jun 10, 2014 9:19 am
by toyo
thx guys.. assignment done. You guys are the best
