JavaScript - Help - Image Counter Double Digits (00/00)
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! Similar TutorialsI am working on my personal portfolio site, and am using a code that will make each portfolio piece appear in a new div when the name of the piece is clicked on. The problem is, JS does not seem to recognize double digits. I am not familiar with JS at all, I just got comfortable with CSS/HTML a few weeks ago! I am in over my head. It would really, really help if someone could show me how to change the code so that I could make about 15 to 20 divs instead of 9. Here is the code: Code: <script language="JavaScript"> numdivs=9 IE5=NN4=NN6=false if(document.all)IE5=true else if(document.layers)NN4=true else if(document.getElementById)NN6=true function init() { showDiv(0) } function showDiv( which ) { for(i=0;i<numdivs;i++) { if(NN4) eval("document.div"+i+".visibility='hidden'") if(IE5) eval("document.all.div"+i+".style.visibility='hidden'") if(NN6) eval("document.getElementById('div"+i+"').style.visibility='hidden'") } if(NN4) eval("document.div"+which+".visibility='visible'") if(IE5) eval("document.all.div"+which+".style.visibility='visible'") if(NN6) eval("document.getElementById('div"+which+"').style.visibility='visible'") } </script> Thank you for taking the time to read this! Hopefully someone can help. I am using a great js gallery script from ....http://coffeescripter.com/code/ad-gallery/ they have a counter for the number of images shown, the number changes as user clicks on next bottom. from looking at the script, the counter is anchor to .ad-info and the counter code from the JS is ..... _afterShow: function() { this.gallery_info.html((this.current_index + 1) + ' / '+ this.images.length); if(!this.settings.cycle) { Can anyone help make the number show double digits only for the numbers 1,2,3,4,5,6,7,8,9 (example- 03/07 or 09/28 or 03/58).. etc..etc thanks for looking. So far I've logged forty hours in total trying to locate and fix the major problems in this code. I've worked with two other forums and a pay-by-minute guru to no avail. I am hopeful that the good folks here at CodingForums will be able to take this code the final distance. I'll try to be verbose without boring anyone. Summary: This code was written in 2005/2007 by "Wonder" at ProBoards. I teach a fourth grade game design and applied mathematics class to home-schoolers on a ProBoards forum. It is placed in the global footer of the forum to allow forum members to roll dice in their posts. The code was incomplete. I worked with "Jordan" at ProBoards to fix the parts that were incomplete. A problem with the code resulted. Primary resolution I'm seeking: Right now the code does everything I could possibly want. However, it is mistakenly reading double-digit numbers (XY) as X = sides of die and Y = a negative modifier. Once this issue is fixed, I can take the roller back to my students and they can game together. Secondary resolutions I'm seeking: (1) I've been told twice that the code should be "tabbed out." Not sure what that means but I guess it makes it less messy. (2) When clicking the "Add Tag" button the code generates, it automatically inserts [dice=6] into a forum post. Would love this to simply be [dice=X] The original code from "Wonder": Code: <style type="text/css"> .dicebg {background-color: FFFFFF;border:solid 2px #000000;} .dicefont {background-color: FFFFFF;color: 000000; font-weight:bold;} </style> <script> //Dice Rolls In Posts v1.1 updated 31 October 2008 //Copyright 4-23-2007 ~Wonder //May be reposted anywhere as long as this header remains in tact //Do you want the dice to line of horizontally(true) or vertically(false) diceAlignment=true; //Enter URL of the image you want to appear as the dice ubbc button UBBCdiceImage="http://img100.imageshack.us/img100/6118/diceicon9rx.gif"; //Enter the default # of sides defaultSides=6; //Enable dice in preview? true or false enablePreview=true; rs="";mainForm=""; if(document.postForm) { mainForm=document.postForm; if(location.href.match(/action\=modifypost/)){enablePreview=true;} mainForm.color.parentNode.innerHTML+="<a href=javascript:add(\"[dice="+defaultSides+"]\",\"\")><img src=\""+UBBCdiceImage+"\" alt=\"Insert Dice Roll\" border=\"0\"></a>"; mainForm.onsubmit=addRand; mainForm.message.value=mainForm.message.value.replace(/(\[rand\=\d+\])/ig,""); rs=RegExp.$1; rs=(/\[rand\=/.test(rs))?rs:""; if(location.href.match(/quote\=\d+/)) { mainForm.message.value=mainForm.message.value.replace(/(\[dice\=\d+\])/ig,""); rs=""; } } else if(location.href.match(/action\=display/)) { ta=document.getElementsByTagName("textarea"); if(ta.length>0 && ta[0].name=="message") { mainForm=ta[0].parentNode; mainForm.onsubmit=addRand; } } /////////////////////// if(location.href.match(/action\=(display|pmview|recent|userrecentposts|gotopost|search|calendarview)/) || (!location.href.match(/action\=/) && document.postForm && enablePreview)) { hr=document.getElementsByTagName("hr"); for(i=0;i<hr.length;i++) { if(typeof(hr[i].parentNode)!="undefined" && hr[i].parentNode.tagName=="TD" && typeof(hr[i].parentNode.lastChild)!="undefined" && typeof(hr[i].parentNode.lastChild.lastChild)!="undefined" && hr[i].parentNode.lastChild.lastChild.nodeType!=1) { n=hr[i].parentNode.lastChild; rand=n.innerHTML.match(/\[rand\=\d+\]/); if(rand!=null) { n.innerHTML=n.innerHTML.replace(rand[0],""); rand=rand[0].replace(/[^\d]/g,""); dice=n.innerHTML.match(/\[dice\=\d+(\+\d+)?\]/ig); if(dice!=null) { for(k=0;k<dice.length;k++) { numb=dice[k].match(/\d+(\+\d+)?/); numb=numb[0].split("+"); addon=numb.length>1?parseInt(numb[1],10):0; numb=parseInt(numb[0],10); roll=Math.round((parseFloat(rand.substring(k,k+2)+"."+rand.substring(k+2,rand.length))/100)*(numb-1))+1+addon; n.innerHTML=n.innerHTML.replace(dice[k],"<table "+(diceAlignment?"style=\"display:inline\"":"")+" border=0 cellpadding=0 cellspacing=0><tr><td><table class=dicebg cellpadding=1 cellspacing=0><tr><td><center><font class=dicefont size=\"+1\"><b>"+roll+"</b><br><font size=\"1\">"+numb+" sides"+(addon>0?"+"+addon:"")+"</font></font></center></td></tr></table></td></tr></table> "); } } } } } } function addRand() { mainForm.message.value=mainForm.message.value.replace(/(\[rand\=\d+\])/ig,""); if((rs.length==0 && mainForm.message.value.match(/(\[dice\=\d+(\+\d+)?\])/)) && (enablePreview==true || (enablePreview==false && mainForm.nextaction.value=="post"))) { mainForm.message.value+="[rand="+(Math.random()+"").replace(/0\./,"")+(Math.random()+"").replace(/0\./,"")+(Math.random()+"").replace(/0\./,"")+( Math.random()+"").replace(/0\./,"")+"]"; } else { mainForm.message.value+=rs; } disable(mainForm); } </script> The altered code from "Jordan": Code: <style type="text/css"> .dicebg {background-color: FFFFFF;border:solid 2px #000000;} .dicefont {background-color: FFFFFF;color: 000000; font-weight:bold;} </style> <script> //Dice Rolls In Posts v1.1 updated by Jordan October 2009 //Copyright 4-23-2007 ~Wonder //May be reposted anywhere as long as this header remains in tact //Do you want the dice to line of horizontally(true) or vertically(false) diceAlignment=true; //Enter URL of the image you want to appear as the dice ubbc button UBBCdiceImage="http://img100.imageshack.us/img100/6118/diceicon9rx.gif"; //Enter the default # of sides defaultSides=6; //Enable dice in preview? true or false enablePreview=true; rs="";mainForm=""; if(document.postForm) { mainForm=document.postForm; if(location.href.match(/action\=modifypost/)){enablePreview=true;} mainForm.color.parentNode.innerHTML+="<a href=javascript:add(\"[dice="+defaultSides+"]\",\"\")><img src=\""+UBBCdiceImage+"\" alt=\"Insert Dice Roll\" border=\"0\"></a>"; mainForm.onsubmit=addRand; mainForm.message.value=mainForm.message.value.replace(/(\[rand\=\d+\])/ig,""); rs=RegExp.$1; rs=(/\[rand\=/.test(rs))?rs:""; if(location.href.match(/quote\=\d+/)) { mainForm.message.value=mainForm.message.value.replace(/(\[dice\=\d+\])/ig,""); rs=""; } } else if(location.href.match(/action\=display/)) { ta=document.getElementsByTagName("textarea"); if(ta.length>0 && ta[0].name=="message") { mainForm=ta[0].parentNode; mainForm.onsubmit=addRand; } } /////////////////////// if(location.href.match(/action\=(display|pmview|recent|userrecentposts|gotopost|search|calendarview)/) || (!location.href.match(/action\=/) && document.postForm && enablePreview)) { hr=document.getElementsByTagName("hr"); for(i=0;i<hr.length;i++) { if(typeof(hr[i].parentNode)!="undefined" && hr[i].parentNode.tagName=="TD" && typeof(hr[i].parentNode.lastChild)!="undefined" && typeof(hr[i].parentNode.lastChild.lastChild)!="undefined" && hr[i].parentNode.lastChild.lastChild.nodeType!=1) { n=hr[i].parentNode.lastChild; rand=n.innerHTML.match(/\[rand\=\d+\]/); if(rand!=null) { n.innerHTML=n.innerHTML.replace(rand[0],""); rand=rand[0].replace(/[^\d]/g,""); dice=n.innerHTML.match(/\[dice\=\d+((\+|\-)\d+)?\]/ig); if(dice!=null) { for(k=0;k<dice.length;k++) { numb=dice[k].match(/\d+((\+|\-)\d+)?/); numb=numb[0].split(RegExp.$2); unsigned = (RegExp.$2 == "+") ? true : false; addon=numb.length>1?parseInt(numb[1],10):0; if(!unsigned)addon = addon - addon * 2; numb=parseInt(numb[0],10); roll=Math.round((parseFloat(rand.substring(k,k+2)+"."+rand.substring(k+2,rand.length))/100)*(numb-1))+1+addon; n.innerHTML=n.innerHTML.replace(dice[k],"<table "+(diceAlignment?"style=\"display:inline\"":"")+" border=0 cellpadding=0 cellspacing=0><tr><td><table class=dicebg cellpadding=1 cellspacing=0><tr><td><center><font class=dicefont size=\"+1\"><b>"+roll+"</b><br><font size=\"1\">"+numb+" sides"+(addon>0?"+"+addon:addon)+"</font></font></center></td></tr></table></td></tr></table> "); } } } } } } function addRand() { mainForm.message.value=mainForm.message.value.replace(/(\[rand\=\d+\])/ig,""); if((rs.length==0 && mainForm.message.value.match(/(\[dice\=\d+((\+|\-)\d+)?\])/)) && (enablePreview==true || (enablePreview==false && mainForm.nextaction.value=="post"))) { mainForm.message.value+="[rand="+(Math.random()+"").replace(/0\./,"")+(Math.random()+"").replace(/0\./,"")+(Math.random()+"").replace(/0\./,"")+( Math.random()+"").replace(/0\./,"")+"]"; } else { mainForm.message.value+=rs; } disable(mainForm); } </script> My incredibly detailed account of my last few weeks with this code: Back in 2005, a user named "Wonder" wrote a nifty piece of code that fits into any ole ProBoard's global footer. Once installed on a forum, it allows users to type the command [dice=X] where X is the number of sides for the single die they want to roll and it gives them a random result that's very attractive (a small white box with a black border and a bold, large result with smaller text below that reads: Xsides) and not "easy" to change/alter/cheat. To roll more than one die, you simply string the command like [dice=X][dice=X][dice=X][dice=X]. The code also allows for positive modifiers (bonuses) such as [dice=X+Y] where the result has the same compact, attractive format and the small text reads: Xsides+Y Wonder posted that his code would also allow negative modifiers (penalties) but, actually, no one seems to have ever tested that part... until September 2009 when along came pesky me. I went over to the ProBoards support forum because Wonder's code is included in their official database. I posted the problem and a user named Jordan tweaked the code several times, each time getting it closer to providing the correct result. The correct result being that when a user types the command [dice=X-Y] the result is the attractive box, the larger number above and the smaller text below that reads Xsides-Y (in addition to continuing to accept [dice=X] and [dice=X+Y] and offer the same format of results). Jordan's version of the code now does all this. But when I started testing it I realized that whenever a user types a command that gives the die double-digit sides (10, 12, 20, etc), the code now reads it like this: [dice=10] results in 1sides-0 or [dice=12] results in 1sides-2. So double-digit numbers are being read as the number of sides and a negative modifier *sigh* Very bad news. Jordan needed to pass on further work on the code because (understandably) it was taking too much time and it was "messy." Since I am not a coder myself, most JavaScript looks messy to me but I believe Jordan. I then took the code to a pay-by-minute help website but was gently told that the code was so messy that it would take too long to debug and it wouldn't be worth the charge since the roller is being used for a non-profit classroom project for my fourth graders. I thought that was very thoughtful... but I'm back at square one, really. I have attached everything I have: The very original code from Wonder (the one that doesn't read negative modifiers at all) and the latest from Jordan (that reads double-digits incorrectly). The only other cute/attractive thing about the code that I'll point out (so you don't see it in the code and wonder, "What the heck is that?" is: When you install the code into a forum, it adds a tiny die-shaped button to the Add Tags menu. Users can click the little thing and the code automatically inserts [dice=6] for them. Personally, this doesn't help my students and I would love it if the button just inserted [dice=X] but that's fine. *deep breath* Whew! That's about it. Thank you for putting up with my blather. I sincerely appreciate any help you can offer. I know your time is valuable and I've taken quite a bit just posting my full report... I just wanted to try to be verbose :) Jennifer hi I wonder if someone out there can help me. I am very new to javascript and i have manged to understand a little of a double combo box with description however I would now like to be able to not only change the comment underneth but also add an image. This image (along with the comment) changes everytime the dropdownbox changes. I just cant seem to add the image. Please can anyone help I would really appreciate it and be extremely grateful. gr T Ooook so this is probably the stupidest question ever. I know in java you can take advantage of a number being an int (not double) and divide by something without getting a remainder. But in javascript you dont declare what kind of variable something is. So my problem is: Given any double or triple digit number, how do i get all but the last digit. Like if i have 13, I need to make an int with 1. If it's 103 i need one with 10. Thanks!! Is it possible to convert the getTime() result into an actual number or text type format where the length function can be used to return only the last 2 digits of the number in a text or number format that is NOT a date format? I have spent quite a bit of time hunting for this and suspect that I am attempting the impossible ?? Thanx Disregard - I believe I have figured it out finally!! I have a number var number = 1,235.326232 I need to display it like following with the last 4 numbers in red. 1,235.32 6232 I have tried number.slice(0,-4)+"<font color='red'>"+number.substr(number.length-5,4); however it keeps messing up the comma and decimal placement. hi, i'm trying to keep a copy of a variable at 4 digits.. this is what i came up with.. it's working but i'm only a noob, so i would very like to know is there any other simpler and/or elegant way to do this.. also i would appreciate it if you could point out any bad syntax or something.. Code: page = 100 function makeit4digits(){ page4digit = page if (page<10) { page4digit = "000"+ page } else if (page<100) { page4digit = "00"+ page } else if (page<1000) { page4digit = "0"+ page } } Hello all I'm trying to get this function to check for 10 digits only but alert shows regardless of less / more or exactly 10 digits --- what am I missing? any help on sorting this greatly appreciated. Code: function validate(form) { if (document.forms[0].callme.checked) { var phone = document.forms[0].mobile.value; // assign value to var phone = phone.replace( /[^\d]/g, "" ); // zap all non-digit characters if ( document.forms[0].mobile.length != 10 ) // chk for 10 digits{ alert("Enter 10 numbers"); return false; } else { alert("Yahoo"); } } low tech I have the following string "d3-23-76-546" I'm looking for a regular expression that will match everything in this string before 546 so that I can replace it with an empty string and just be left with 546. The string could be of any length and contain any number of hyphens. Hi I would like to write a parser like the one below except I would like it to take characters with the the digits like 345j, 982p0, what would I change to be able to have characters with numbers? Code: ts.addParser({ id: "digit", is: function (s, table) { var c = table.config; return $.tablesorter.isDigit(s, c); }, format: function (s) { return $.tablesorter.formatFloat(s); }, type: "numeric" }); Hello, I've obtained the following code. Code: function makeDate(){ var d = new Date(); var strDate=d.getFullYear() + "/" + (d.getMonth()+1) + "/" + d.getDate() + " "; strDate += d.getHours() + ":" + d.getMinutes() +":"+ d.getSeconds() ; return strDate; and I think I'm going to get the time and date indications in 2 digits. I want to get it like this: 2009/12/07 18:07:33 NOT like: 2009/12/7 18:7:33 How should I alter the code? Can anyone help? Thanks in advance. If number is more than 24 digits, modulus operator is not giving correct output here attached sample code [code]<script type="text/javascript"> var a=10000000000000000000000.0; var b=10.0; var c=a % b; alert("c"+c); </script>[code] please tel me solution 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 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? 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! 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 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 |