|
JavaScript - Counter For Banner
Similar Tutorials-edit - nevermind. mods plz delete.
so i have to use the addEvent() to call the makeBannerAd function which i believe i have done so.... but then i gotta <div id = "bannerBox"> </div> and loop through all the iteams in my adsURL Array and for each item i must create the html fragment <div class = "bannerAd"> <a href = "url"> <img src = "bannerindex" /> </a> </div> i must set the z index number to each number ad to the value of the counter index and append the banner ad to the banner Box element.....Append the bannerBox to the documentbody, run the changeBannerAd() every 10 sec Banners.js Code: //this is the global scope here when you declare out side of a function it because global or at the top of the js file
var nextAd; //this is going to be used to change or show the next banner ad to the web page
function addEvent(object, evName, fnName, cap)
{
makeBannerAds();
if (object.attachEvent)
{
object.attachEvent("on" + evName, fnName);
}//end if
else if (object.addEventListener)
{
object.addEventListener(evName, fnName, cap);
}//end else if
}//end function addEvent
function makeBannerAds()
{
//this creates a banner box to store the banner ads in
var bannerBox = document.createElement("div");
bannerBox.id = "bannerBox";
for(var i = 0; i < document.adsURL.length; i++)
{
if(adsURL[i] != <div class = "bannerAd">,
<a href ="url">,
<img src ="bannerindex" />,
</a>,
</div>)
{
if
(adsURL[i] = <div class = "bannerAd">,
<a href ="url">,
<img src ="bannerindex" />,
</a>,
</div>)
else
return adsURL[i] = <div class = "bannerAd">,
<a href ="url">,
<img src ="bannerindex" />,
</a>,
</div>;
}//end if
}//end if
}//end function makeBannerAds
ads.js Code: function storeURL()
{
//this creates a new array, the array is called adsUR:
var adsURL = new Array();
//this stores each item in the array using a index place holder
adsURL[0] = "testpage0.htm";
adsURL[1] = "testpage1.htm";
adsURL[2] = "testpage2.htm";
adsURL[3] = "testpage3.htm";
adsURL[4] = "testpage4.htm";
adsURL[5] = "testpage5.htm";
adsURL[6] = "testpage6.htm";
adsURL[7] = "testpage7.htm";
adsURL[8] = "testpage8.htm";
adsURL[9] = "testpage9.htm";
adsURL[10] = "testpage10.htm";
adsURL[11] = "testpage11.htm";
}//end function storeURL
books.html file Code: <head>
<!--
-->
<title>Online Bookworms</title>
<link href="bw.css" rel="stylesheet" type="text/css" />
<link href="bannerstyles.css" rel="stylesheet" type="text/css" />
<script src ="ads.js" type ="text/javascript"></script> <!--calls the external file called slideshow.js -->
<script src ="banners.js" type ="text/javascript"></script> <!--calls the external file called slideshow.js -->
</head>
<body>
<div id="page">
<h1 id="heading"><img src="bwlogo.jpg" alt="Online Bookworms" /></h1>
<ul id="menu">
<li><a href="#">Home</a></li>
<li><a href="#">Reviews</a></li>
<li><a href="#">Forums</a></li>
<li><a href="#">Book Swaps</a></li>
<li><a href="#">OBW Store</a></li>
<li><a href="#">Author's Corner</a></li>
<li><a href="#">My Account</a></li>
</ul>
<ul id="menu2">
<li><a href="#">My Reading List</a></li>
<li><a href="#">Review a Book</a></li>
<li><a href="#">Join a Discussion</a></li>
<li><a href="#">Post to a Forum</a></li>
<li><a href="#">My Mail</a></li>
<li><a href="#">My Posts</a></li>
<li class="newgroup"><a href="#">Reading Recommendations</a></li>
<li><a href="#">Books of the Month</a></li>
<li class="newgroup"><a href="#">MP3 Downloads</a></li>
<li><a href="#">Podcast</a></li>
<li><a href="#">RSS Feeds</a></li>
<li class="newgroup"><a href="#">Tech Support</a></li>
<li><a href="#">Comments</a></li>
<li><a href="#">About online BookWorms</a></li>
</ul>
<div id="main">
<h2>Welcome</h2>
<p>Welcome to <strong>online BookWorms</strong> — your location on
the Web for books, magazines, short stories, poetry, and essays.
Please explore our online bookstore for the lowest prices on new
and rare books. Share your love of reading by joining one of our
many forums and discussion groups. Are you an aspiring critic?
We welcome book reviews and essays on your favorite authors and
works.
</p>
<h2>News</h2>
<p>We are very happy to introduce the <a href="#">online BookWorms
Podcast</a>. The podcast will contain free excerpts from great
works of fiction and reviews of current books. You can quickly
subscribe to this new BookWorms feature <a href="#">here</a>.
</p>
<p>Take a few moments now to explore our book shelves. And remember to
patronize our sponsors by clicking the banner ads at the top of the
page. Enjoy browsing our site!
<p id="signature">
<img src="signature.jpg" alt="Helen Ungerstatz" />
</p>
</div>
</div>
</body>
</html>
I have the following codes and it seems to work well but when exiting the site and re-entering it resets the values to 0 again. I am not sure how to proceed with this, been considering cookies but what if the user clears there cookies, I then looked at PHP but not understanding that to well at this stage. Javascript Code: // Function to count clicks on links
var clicks1 = 0;
var clicks2 = 0;
var clicks3 = 0;
var clicks4 = 0;
function link1(){
document.getElementById('clicked1').value = ++clicks1;
}
function link2(){
document.getElementById('clicked2').value = ++clicks2;
}
function link3(){
document.getElementById('clicked3').value = ++clicks3;
}
function link4(){
document.getElementById('clicked4').value = ++clicks4;
}
HTML Code: Code: <tr valign="middle" align="center"><td colspan="1"><a target="_blank" href="http://mistiquestormelectronics.webs.com/" onclick="link1()"><img src="site_graphics/reinet.jpg" alt="Mistique Storm" width="120" height="90" /></a></td> <td colspan="2" align="left"><p>For all your Electronic equipment needs.</p></td> <td colspan="1" width="8%"><input id="clicked1" style="color: #000000; font-weight:bold; border-style: none; font-family: arial; background-color: #00FF00; text-align: center;" readonly="readonly" size="10" onfocus="this.blur();" value="0" ></td></tr> Any ideas, suggestions. Please Help? Hey Everyone, I'm working on a counter. I have two images - each with their own click count. Right now each time the page loads the counter goes back to zero. I would assume I need some kind of server side coding. Any recommendations? Here's what I have so far. <html> <head> <script type="text/javascript"> var counter = 0; function increaseloveit() { counter += 1; document.getElementById('loveit').value = counter; } var counter = 0; function increasehateit() { counter += 1; document.getElementById('hateit').value = counter; } </script> </head> <body> <form> <a href="#" onclick="javascript:increaseloveit();"><input type="button" value="Love It!" name="loveit" onclick="" /></a><input id="loveit" value="0" size="2" /></form> <form> <a href="#" onclick="javascript:increasehateit();"><input type="button" value="Hate It!" name="hateit" onclick="" /></a><input id="hateit" value="0" size="2" /></form> </body> </html> I am trying to use the Jquery loader (this ends when page loads) but I want it to load how many seconds the page took. (using the clean preloader) $( "#progressbar" ).progressbar({ value: setTimeout("seconds++",10000000) }); but getting "anything" to work in the "VALUE" has been such a pain. any one that knows how to create a timer to add to the value so that preload will keep loading? or if even possible? thanks So I'm really new to javascript and html. The most advanced thing Ive made was probably a Russian rullete simulator, but I need help with this one program Im working on. So if anyone could tell me whats wrong with this, I would appreciate it! <html> <head> <font size="4">Click the button below as many times as you can</font> <br> <script type="text/javascript"> var clicks=0 function count() { clicks=clicks+1; } </script> </head> <body> <input type="button" value="Click Me" OnClick="count()"> <br> <p>Clicks: <script type="text/javascript"> document.write(clicks); </script></p> </body> </html> I need help with a counter that will either display a different image everyweek or change text every week. The scenario is a counter will be on the top right corner of the page, and every week the number will change from 1 to 2 to 3... to 52... I searched on this forum for answers, i found some similar for a different day counter. Any help would be great! Hi All, could you please help me. A have a little program and i need to count somehow how many times a while loop is ran. how could i do that? Thanks for your help Anybody help to start out this code: Create a "nag" counter that tells users to register. Save the counter in a cookie and display a message reminding users to register every fifth time they visit your site. There are four other parts to this task that I know how to do. I cannot find anything close to this in our book referencing a nag-counter or something similar to it. Thanks, in advance. Regards, AO5431 Hi Guys, Hope you can help. My sister has made a web site with a web counter and want to get the counter up by a few hundered. She cannot alter the number manually. Is there a script i can use to get the web counter up by a few hundred? So in other words a web page with java on so it gones on to her site (adds a count) leave it Or refresh it then reload it. Hope i have made my self Clear. thanx, Or even i culd run a web page which loads the page, closes it and load it again. Thanx. Lusa.. I have the following code but it is not even showing up in the browser. I am very new to JS and very willing to learn. The code was originally found on this site and I have tweaked it and now it doesn't work...Any assistance would be much appreciated. <script type = "text/javascript"> var seconds; var clockId; function startClock(seconds){ timeInSeconds = parseInt(seconds); clockId = setInterval("tick()",1000); } function runClock() { var seconds = timeInSeconds; if (seconds > 60) { // stop at "" seconds alert ("Your time is up!"); clearInterval(clockId); // stop counting return false; } else { timeInSecs++; } var hours= Math.floor(seconds/3600); seconds %= 3600; var mins = Math.floor(seconds/60); secs %= 60; var result = ((hours < 10 ) ? "0" : "" ) + hours + ":" + ( (mins < 10) ? "0" : "" ) + mins + ":" + ( (secondss < 10) ? "0" : "" ) + seconds; document.getElementById("countdown").innerHTML = result; } startClock(0); // start count at 0 seconds </script> <span id="countdown" style="font-weight: bold;"></span> H, I'm trying to create an sms form. but I want the users to be able to monitor the characters and sms number as they type...taking 160 characters to be 1 page. pls I'll need help with coding this form to display characters left in 'ch_count' box and number of pages in the 'pages' box while typing in the 'message' textarea....hope it's clear enough...thanks Code: <p> <textarea name="message" cols="" rows="" id="message"></textarea> </p> <p> <input name="ch_count" type="text" id="ch_count" size="8" /> characters left <input name="pages" type="text" id="pages" size="8" /> pages </p> Hi, I have added a time counter in below code. This is used to track the total time of a project. If a person is going on break, then they will apply the break that stops the time counter. However, once they come back from break and end the break, then time is counting at double speed (two seconds instead at one second). Is there any mistake that I done that made the time counter to increment by 2 seconds instead of 1 second after break. Any help please.... Code:
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7" />
<title>Strategy One - Tracker</title>
<link rel="stylesheet" href="style.css" type="text/css" media="screen" />
<!--[if IE 6]><link rel="stylesheet" href="style.ie6.css" type="text/css" media="screen" /><![endif]-->
<!--[if IE 7]><link rel="stylesheet" href="style.ie7.css" type="text/css" media="screen" /><![endif]-->
<!-- Script for Current time in text box -->
<script type="text/javascript">
function GetDate()
{
var curDateTime = new Date()
var curHour = curDateTime.getHours()
var curMin = curDateTime.getMinutes()
if(curHour<10) curHour = "0" + curHour
if(curMin<10) curMin = "0" + curMin
document.getElementById('start_time').value = curHour + ":" + curMin;
var row = document.getElementById("end1_time");
var row1 = document.getElementById("start1_time");
row.style.display = 'none';
row1.style.display = 'none';
}
</script>
<!-- End of Script for Current time in text box -->
<!-- Script for Current time in text box -->
<script type="text/javascript">
function GetDate1()
{
var curDateTime = new Date()
var curHour = curDateTime.getHours()
var curMin = curDateTime.getMinutes()
if(curHour<10) curHour = "0" + curHour
if(curMin<10) curMin = "0" + curMin
document.getElementById('end_time').value = curHour + ":" + curMin;
var row = document.getElementById("start1_time");
var row1 = document.getElementById("end1_time");
var row2 = document.getElementById("start2_time");
var row3 = document.getElementById("end2_time");
row.style.display = 'none';
row1.style.display = 'none';
row2.style.display = 'none';
row3.style.display = 'none';
}
</script>
<script type="text/javascript">
function GetDate2()
{
var curDateTime = new Date()
var curHour = curDateTime.getHours()
var curMin = curDateTime.getMinutes()
if(curHour<10) curHour = "0" + curHour
if(curMin<10) curMin = "0" + curMin
document.getElementById('break_time_out').value = curHour + ":" + curMin ;
var row = document.getElementById("end2_time");
row.style.display = '';
}
</script>
<script type="text/javascript">
function GetDate3()
{
var curDateTime = new Date()
var curHour = curDateTime.getHours()
var curMin = curDateTime.getMinutes()
if(curHour<10) curHour = "0" + curHour
if(curMin<10) curMin = "0" + curMin
document.getElementById('break_time_in').value = curHour + ":" + curMin ;
}
</script>
<script type="text/javascript">
function tout1()
{
var temp= document.tracker.start_time.value;
if(temp.length>0)
{
var row1 = document.getElementById("end1_time");
var row2 = document.getElementById("start2_time");
row1.style.display = 'none';
row2.style.display = 'none';
}
else
{
var row = document.getElementById("start1_time");
var row1 = document.getElementById("end1_time");
var row2 = document.getElementById("start2_time");
row.style.display = 'none';
row1.style.display = 'none';
row2.style.display = 'none';
}
}
function tout2()
{
var temp= document.tracker.start_time.value;
if(temp.length>0)
{
var row = document.getElementById("start1_time");
var row1 = document.getElementById("end1_time");
var row2 = document.getElementById("start2_time");
var row3 = document.getElementById("end2_time");
row.style.display = 'none';
row1.style.display = 'none';
row2.style.display = 'none';
row3.style.display = 'none';
}
else
{
var row = document.getElementById("start1_time");
var row1 = document.getElementById("end1_time");
var row2 = document.getElementById("start2_time");
var row3 = document.getElementById("end2_time");
row.style.display = '';
row1.style.display = 'none';
row2.style.display = 'none';
row3.style.display = 'none';
}
}
</script>
<script type="text/javascript">
var seconds = 0;
var minutes = 0;
var hours = 0;
function zeroPad(time) {
var numZeropad = time + '';
while(numZeropad.length < 2) {
numZeropad = "0" + numZeropad;
}
return numZeropad;
}
function countSecs() {
var j=document.tracker.hide.value;
if(j=="yes")
{
seconds++;
if (seconds > 59) {
minutes++;
seconds = 0;
}
if (minutes > 59)
{
hours++
minutes = 0;
}
document.tracker.time_utilization.value = zeroPad(hours) + ":" + zeroPad(minutes) + ":" + zeroPad(seconds);
}
else
{}
}
function startTimer()
{
action = window.setInterval(countSecs,1000);
}
function s()
{
document.tracker.hide.value ="yes";
startTimer();
}
function p()
{
document.tracker.hide.value ="no";
}
</script>
</head>
<body>
<form name="tracker" method="post" action="processor.php" onsubmit="return formCheck(this);">
<label class="formFieldQuestion">Start Time *</label><input readonly class=mainForm type=text name=start_time id=start_time size='30' value=''>
<input type="button" id="start1_time" style="width: 100px" Value="Start Time" onClick="javascript:GetDate();s();"></li>
<label class="formFieldQuestion">End Time *</label><input readonly class=mainForm type=text name=end_time id=end_time size='30' value='' >
<input type="button" id="end1_time" style="width: 100px" Value="End Time" onClick="javascript:GetDate1(); p();" style='display: none'></li>
<input type="hidden" name="hide" />
<label class="formFieldQuestion">Break Time Out </label><input class=mainForm readonly type=text name=break_time_out id=break_time_out size='30' value='' >
<input type="button" id="start2_time" style="width: 100px" Value="Start Time" onClick="javascript:GetDate2();tout1();p();"></li>
<label class="formFieldQuestion">Break Time In </label><input class=mainForm readonly type=text name=break_time_in id=break_time_in size='30' value=''>
<input type="button" id="end2_time" style="width: 100px" Value="End Time" onClick="javascript:GetDate3(); tout2();s();" style='display: none'></li>
<label class="formFieldQuestion">Time Utilization</label><input class=mainForm type=text name=time_utilization id=time_utilization size='30' value='' readonly></li>
<br /> <br />
<input id="saveForm" class="mainForm" type="submit" value="Submit" style="width : 100px"/>
</form>
</body>
</html>
Hey Everyone, I'm trying to set up two different buttons that count their own individual clicks. So far I have everything except where one button leaves off, the other picks up. So if I click the left one three times it shows the number 3, and then if I click the button next to it, that button picks up at 4. I want each button to have its own count. Any ideas? Here's what I have so far. <html> <head> <script type="text/javascript"> var counter = 0; function increaseloveit() { counter += 1; document.getElementById('loveit').value = counter; } var counter = 0; function increasehateit() { counter += 1; document.getElementById('hateit').value = counter; } </script> </head> <body> <form> <a href="#" onclick="javascript:increaseloveit();"><input type="button" value="Love It!" name="loveit" onclick="" /></a><input id="loveit" value="0" size="2" /></form> <form> <a href="#" onclick="javascript:increasehateit();"><input type="button" value="Hate It!" name="hateit" onclick="" /></a><input id="hateit" value="0" size="2" /></form> </body> </html> hello, I have a textbox in my .net page, and totally new to java script. How do i get a script that will count the data being written in the text box to show increments of 100 and write the value to the bottom of the textbox. e.g. When u get to 100, at the bottom it says "1st hundred" ... and to 200 it writes "2nd hundred" UP to 500 ??? Please help thanks Hi, First i don know if im posting at the right place or if you even take request here, feel free to direct me to the right place. What i am looking for is someone to make a simple counter for me. Basically i want that every time i press a certain key on my keyboard it will increase the counter amount and would then divide it by 60 every hour. Actually im looking for it to only show that average and refresh every hour. So it would start at 0 then update after the first hour and so on. (I also need a graphical interface) I have very few knowledge in coding and would very appreciate if someone could do that for me. Thank you ! Reply With Quote 01-10-2015, 11:39 PM #2 Old Pedant View Profile View Forum Posts Supreme Master coder! Join Date Feb 2009 Posts 28,311 Thanks 82 Thanked 4,754 Times in 4,716 Posts I don't think this is something you would do with JavaScript. I think you need a ".exe" (on Windows) program. And that's a lot more complex. The problem is your request to capture a certain key, presumably no matter what window is at the front. Normally, within a given window, you can only capture a key that is intended for that window. I don't think this is a very easy thing to do. I am using the counter script below to display a count from 1-36. Does anyone know how to edit the javascript to flash or blink the number 36 a few times, and then loop the script to start over and count from 1-36 again (and again)? Here's the script: <html> <head> <title></title> </head> <script type="text/javascript"> var t, max, i; function Increase(amount) { max = amount; i = parseInt(document.getElementById("count").value); t = setInterval("SetIncrease()", 500); } function SetIncrease() { document.getElementById("count").value = ++i; if(i == max) { clearTimeout(t); } } </script> <body onLoad="Increase(36);"> <input id="count" type="text" value="1" style="width:40px;font-family:georgia;font-size:30px;font-weight:bold;color:#CC0000;border: 0px solid #000000;text-align:right;background-color:#FFFF00;" align="center"> </body> </html> Many thanks! Hello, I am a hobbyist coder making a basic website for a friend, and I have a small problem. On an image slideshow, there is a counter at the bottom showing what image it is up to (ie 7/15), I'm not entirely sure how to change this into double digits (ie 07/15) I've found this thread (http://www.codingforums.com/showthread.php?t=212321) but am unsure how to integrate it into the slideshow I'm using, which is a different one. Here is the part from my JS I think that needs modifying: Code:
if (setting.displaymode.type=="manual" &&
!setting.displaymode.wraparound){
this.paginatecontrol()
}
if (setting.$status) //if status container defined
setting.$status.html(setting.curimage+1 + " / " + totalimages)
Is this the right bit of code? If more of the code is needed to solve this please let me know. Any help is greatly appreciated! Hi, I am trying to build a counter in javascript. The time on the counter should be displayed in hours, minutes and seconds<24:00:00>. When the counter reaches 00:00:00, it should stop.I read some books and they say that I must use the setInterval function to implement the timer. The problem is I don't know how to begin it. Could anybody give me some guidance on where to begin to do something like this. My javascript skills are basic as you can probably tell but I do like to learn it step by step. Thanks in advance I have 2 questons. 1) Is there a way for the loop counter to loop while less then [a php variable]? 2) Is there a way to use a counter in the name of the form elements? Example, instead of "switchBox1" use: "switchBoxCounter" instead of "nameaddy1" use: "nameaddyCounter" Code: if(document.form1.switchBox1.checked)
{
document.form1.nameaddy1.style.backgroundColor = "#E5E5E5";
}
else
{
document.form1.nameaddy1.style.backgroundColor = "#FFFFFF";
}
|
|||||||