JavaScript - *** Help *** Text Formatting

I am not very knowledgeable with javascript. I have the following code pasted into my website and it works, but I want to modify it in the following ways:

1) I want the text to only scroll for a maximum of two visible lines at a time.

2) I want the text to scroll only once and then remain in place.

3) I want the text color to be grey (#ABABAB)

---------------------
Here is the code I am using:
---------------------

<script type="text/javascript">
window.onload = WindowLoad;
var _hsSpeed=50; //lower value means faster speed!
var _hsData=new Array();
var _hsCounter=0;
function WindowLoad(event) {
InitializeHorizontalScroll();
}

function InitializeHorizontalScroll() {
var arrElements = document.getElementsByTagName("span");
for (var i=0; i<arrElements.length; i++) {
var element=arrElements[i];
if (element.getAttribute("horizontalscroll") == "1") {
_hsData[_hsCounter] = new Array();
_hsData[_hsCounter]["element"] = element;
_hsData[_hsCounter]["text"] = FindInnerText(element);
_hsData[_hsCounter]["index"] = 0;
_hsCounter++;
}
}
if (_hsCounter > 0)
window.setTimeout("HorizontalScrollTimer();", 100);
}
function HorizontalScrollTimer() {
for (var i=0; i<_hsData.length; i++) {
var element = _hsData[i]["element"];
var strText = _hsData[i]["text"];
var index = parseInt(_hsData[i]["index"]);
element.innerHTML = strText.substr(0, index+1);
index++;
if (index >= strText.length)
index = 0;
_hsData[i]["index"] = index;
}
window.setTimeout("HorizontalScrollTimer();", _hsSpeed);
}

function FindInnerText(objControl, innerText, nestingLevel)
{
if ((typeof nestingLevel != "undefined")&&(nestingLevel > 100))
return innerText;

if (typeof innerText == "undefined")
innerText = "";

if (!objControl)
return innerText;

if (typeof nestingLevel == "undefined")
nestingLevel = 0;

var text=objControl.nodeValue;
if (!text)
text = "";
if (objControl.nodeName.toLowerCase() == "br")
return "\n";


for (var i=0; i<objControl.childNodes.length; i++)
{
text += FindInnerText(objControl.childNodes[i], objControl.childNodes[i].nodeValue, nestingLevel+1);
}

return text;
}
</script>

---------------------
And this is inserted in the body of the page:
---------------------

<span horizontalscroll="1" style="font-family: helvetica;text-transform: uppercase;font-size: 10; letter-spacing: 3; font-color: #ABABAB;">text content</span>

---------------------
Thank to anyone who can assist.
---------------------

I have a string containing a date in the format YYYY-MM-DD and i want to format it so its something like 21st March 2012, how would i do this?

I can't figure out how to properly format the code below. I am looking to add breaks after where it says below. Also to change the color if possible.

Any help would be much appreciated.


function isPPC() {
if (navigator.appVersion.indexOf("PPC") != -1) return true;
else return false;
}
if(isPPC()) {
document.write('<b>Send <A CLASS="contact" HREF=\"mailto:\?subject\=ADD A BREAK AFTER THIS ' + document.title + '?body= ADD A BREAK AFTER THIS ' + '\" onMouseOver="window.status=\'Send your friends e-mail about this page\'; return true" TITLE="Send your friends e-mail about this page">this page<\/A> to a friend</b>');
}
else { document.write('<b>Send <A CLASS="contact" HREF=\"mailto:\?body\=ADD A BREAK AFTER THIS ' + document.title + ' ADD A BREAK AFTER THIS ' + '\" onMouseOver="window.status=\'Send your friends e-mail about this page\'; return true" TITLE="Send your friends e-mail about this page">this page<\/A> to a friend</b>');
}

I have a password check on my join form but it looks ugly the idea is good but it is all unaligned and makes the form look bad. I was wondering if you guys can help me format it i tried my self but it just caused it to not work at all lol.

Right now it looks like this:
----------------------------
| -------- bar color -------- |
----------------------------
GOOD PASSWORD

What i want is it to appear like this:
__________________________
| -------- Good Pass -------- | <- Color in the bg,words in the box!

Code:

(function(A){A.extend(A.fn,{pstrength:function(B){var B=A.extend({verdects:["Very weak","Weak","Medium","Strong","Very strong"],colors:["#f00","#c06","#f60","#3c0","#3f0"],scores:[10,15,30,40],common:["password","sex","god","123456","123","cute","gamer","qwerty","monkey", "apple"],minchar:6},B);return this.each(function(){var C=A(this).attr("id");A(this).after("");A(this).after("<div class=\"pstrength-info\" id=\""+C+"_text\"></div>");A(this).after("<div class=\"pstrength-bar\" id=\""+C+"_bar\" style=\"margin-top: 5px; border: 1px solid gray; font-size: 1px; height: 15px; width: 260px;\"></div>");A(this).keyup(function(){A.fn.runPassword(A(this).val(),C,B)})})},runPassword:function(D,F,C){nPerc=A.fn.checkPassword(D,C);var B="#"+F+"_bar";var E="#"+F+"_text";if(nPerc==-200){strColor="#000";strText="Unsafe password word!";A(B).css({width:"0%"})}else{if(nPerc<0&&nPerc>-199){strColor="#ccc";strText="Too short";A(B).css({width:"5%"})}else{if(nPerc<=C.scores[0]){strColor=C.colors[0];strText=C.verdects[0];A(B).css({width:"10%"})}else{if(nPerc>C.scores[0]&&nPerc<=C.scores[1]){strColor=C.colors[1];strText=C.verdects[1];A(B).css({width:"25%"})}else{if(nPerc>C.scores[1]&&nPerc<=C.scores[2]){strColor=C.colors[2];strText=C.verdects[2];A(B).css({width:"50%"})}else{if(nPerc>C.scores[2]&&nPerc<=C.scores[3]){strColor=C.colors[3];strText=C.verdects[3];A(B).css({width:"75%"})}else{strColor=C.colors[4];strText=C.verdects[4];A(B).css({width:"92%"})}}}}}}A(B).css({backgroundColor:strColor});A(E).html("<span style='color: "+strColor+";'>"+strText+"</span>")},checkPassword:function(C,B){var F=0;var E=B.verdects[0];if(C.length<B.minchar){F=(F-100)}else{if(C.length>=B.minchar&&C.length<=(B.minchar+2)){F=(F+6)}else{if(C.length>=(B.minchar+3)&&C.length<=(B.minchar+4)){F=(F+12)}else{if(C.length>=(B.minchar+5)){F=(F+18)}}}}if(C.match(/[a-z]/)){F=(F+1)}if(C.match(/[A-Z]/)){F=(F+5)}if(C.match(/\d+/)){F=(F+5)}if(C.match(/(.*[0-9].*[0-9].*[0-9])/)){F=(F+7)}if(C.match(/.[!,@,#,$,%,^,&,*,?,_,~]/)){F=(F+5)}if(C.match(/(.*[!,@,#,$,%,^,&,*,?,_,~].*[!,@,#,$,%,^,&,*,?,_,~])/)){F=(F+7)}if(C.match(/([a-z].*[A-Z])|([A-Z].*[a-z])/)){F=(F+2)}if(C.match(/([a-zA-Z])/)&&C.match(/([0-9])/)){F=(F+3)}if(C.match(/([a-zA-Z0-9].*[!,@,#,$,%,^,&,*,?,_,~])|([!,@,#,$,%,^,&,*,?,_,~].*[a-zA-Z0-9])/)){F=(F+3)}for(var D=0;D<B.common.length;D++){if(C.toLowerCase()==B.common[D]){F=-200}}return F}})})(jQuery)

Sorry about the code i know its cluttered lol.

hi Guys,
I have the following codes:
var date1 = new Date(FromDate);

My problem is 'new Date' function covering the date into mm/dd/yyyy format and I want it in dd/mm/yyyy format.

any suggestion please,

I am creating a calculator app and I'm a bit stuck with number formatting.

Example of how I would like a number to be formatted:
$2,899,799

I currently have the formatting working except for the commas. I'm using the following code to achieve this.
My result is currently showing up like this $2899799

Code:

function format (expr, decplaces) {
    var str = "" + Math.round (eval(expr) * Math.pow(10,decplaces))
    while (str.length <= decplaces) {
        str = "0" + str
    }
    var decpoint = str.length - decplaces
    return str.substring(0,decpoint) + str.substring(decpoint,str.length);
	}	

function dollarize (expr) {
	return "$" + format(expr,0)

//RESULT FIELDS
form.AnnualScrapSales.value = dollarize(((A - B) * (C2/100)) * G2)

is there a way to add to this "function format" code to also achieve the commas?

I'm trying to remove a vertical scroll that appeared after I added padding 100% to footer. It was suggested that I use javacript to cause the footer not to expand so I don't have to add padding 100% to footer which will eliminate scroll bar. How do I accomplish this when you remove 100% padding from footer?I don't want to see the grey backgroun under footer. I just want to see footer and that's it.

Here's my code
Code:

<!DOCTYPE HTML>
   
<html xmlns="http://www.w3.org/1999/xhtml">
    <head>  
        <meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
        <title></title>
        
        <style type="text/css">
		#wrapper{width:1000px; height: 520px;margin:-25px auto;   background-color: #3d3d3d;}
		 #header {
       width: 100%;
       height: 75px;
       border: 1px solid #000000;
       margin: 0px 0px 0px 0px;
      
                 padding: 0px 0px 10px 0px;
       background-color: #00a3e8;
       float:left;
       color: #FFFFFF;
       }
	   #contact {position:relative;top:500px;} 
	   *{margin:0px; padding:0px}
#col1{width:200px; height:454px; float:left; 
margin:  0px 0px 0px 0px;
   padding: 0px 0px 0px 0px;
   background-color: #00a3e8; 
     border: 7px solid #000;}
#col2{width:300px; height:454px; float:left;
 background-color: #00a3e8;
   border: 7px solid #000;
   
margin:0px 0px 0px 130px;
padding: 0px 0px 0px 0px;
text-align:center;
   color: #FFFFFF;}
#col3{width:200px; height:454px;background-color:blue;

  margin: 0px 0px 0px 0px;
             padding: 0px 0px 0px 0px;
   background-color: #00a3e8;
   border: 7px solid #000;
   
  float:right;
             color: #000;    }
#footer{width:100%; height:100%; clear:both;
  
   float:left;
    overflow:hidden;
   margin-top:-23px;
    padding: 100% 0px 5px 0px;
   background-color: #00a3e8;
   text-align: center;
   color: #FFFFFF;}

				 
body{overflow-x:hidden; 
    overflow-y:auto;    background-color: #3d3d3d;} 
		</style>
  </head>
    <body>
     <div id="header"><img width="416" height="70" src="MyProfile_clip_image001.gif" alt="UJ" />
    
       </div>
&nbsp;



<div id="wrapper">
  <div id="col1"></div>
  <div id="col2"><div id="contact">Contact Us</div></div>
  <div id="col3"></div>
 
</div>
 <div id="footer"><div id="contact">Contact Us</div></div>
</body>
</html>

Hi,

i am having some problems keeping the formatting of elements the same for html and javascript, i have a seperate css file for all the formatting of the tags in html, and when i use javascript i want it to stay the same.

eg.
when i use <h2> Heading </h2>

below it wont print the same style as above, the color is the same, but the text is bigger and bold.

<script type="text/javascript">
document.write("<h2> Heading </h2>);
</script>

Any help will be greatly appreciated.
Thanks


I want to keep the exact same formatting for both, using the

Hi All,

I wonder if you can help me with some time and date formatting in JS.

I already use a neat date formatting JS script which is useful when a PERL script returns a date field of 'DATE' by converting it from yyyy-mm-dd to dd month(in text) yyyy:

<script type = "text/javascript">

var months = ["January","February","March","April","May","June","July","August","September","October","November"," December"];
var myString = "[[date]]";
var mySplitResult = myString.split("-");
var mm = parseInt(mySplitResult[1],10)-1; // note that months are 0-11
document.write(mySplitResult[2] + " " + months[mm] + " " + mySplitResult[0] );

</script>

I have, however, run across a little problem where I have results coming through with date AND time, e.g.

18:12 2010-07-14

What I need is something that will reorder the above to:

14 July 2010 at 18:12

Can someone help please!

Regards,
Neil

... or at least adding the commas? I need to format this number as currency. It is within the "flot" code, which is a charting framwork. I dont know anything about javascript at all so bear with me.

Here is part of the code, the piece in red calls for the number. This is what I need displayed with commas, so its easy to read. I have found a few examples on the web but I have no idea how to apply them to this code. Can anyone help?

Code:

var previousPoint = null;
$("#placeholder").bind("plothover", function (event, pos, item) {
$("#x").text(pos.x.toFixed(2));
$("#y").text(pos.y.toFixed(2));
 
if ($("#enableTooltip:checked").length > 0) {
if (item) {
if (previousPoint != item.datapoint) {
previousPoint = item.datapoint;
                    
$("#tooltip").remove();
var x = item.datapoint[0].toFixed(2),
y = item.datapoint[1].toFixed(2);
                    
showTooltip(item.pageX, item.pageY,
'<b>' + item.series.label + '</b> '+ ": " +  y );

I have a Number as a String. It goes from 1 to 999 but I need to set the format so that it has leading Zeros. So 1 is 001 and 2 is 002 and 99 is 099.
Is there a way to do this in JavaScript?

Thanks,

~Dave

Hi all,
I have a problem that has my brain turning to goo...
I have a function that mixed with php adds the total numerical valus from different dropdowns.
Code:

<?php if($z == 1) {	?>
<script type="text/javascript"><!--
function updatesum() {
document.form.sum.value =
<?php echo number_format($prodprice,2)?>+
<?php foreach(range('1',$matchcount2) as $i){?>(document.form.sublist<?php echo $i?>.options[document.form.sublist<?php echo $i?>.selectedIndex].id-0) + <?php }?>
(document.form.sublist999.options[document.form.sublist999.selectedIndex].id-0.00); 

}
//--></script>			
<?php }?>

The total is then sent to an input field.

Code:

<div class="left product_text_box product_title">Total Price: <?php echo $currency_type?><input class="product_title" name="sum" readonly style="background:none; border:none" value="<?php echo number_format($prodprice,2)?>"></div>

All works well, but the output allows too many decimals, ie: 46.8966666

I have tried to implement the toFixed(2) with only errors as my reward.

Any help would be appreciated

KF

hi,
i need US zip code formatting on my page. as zip code can be 5 digits or 5-4 digits, our requirement is that when user types in 6th digit, hyphen automatically gets added between 5th and 6th digit. ex: user enters 100161,it should become formatted as 10016-1 and then user can continue to add rest of digits.
pls advice, highly appreciate.
thanks

I'm attempting to integrate a rich-text mail form and use PHPMailer to send HTML email to a Godaddy email account. The rich-text editor script is the WizzyWig one. (Original can be found Here)

Location of form: http://www.westmichiganconcerts.com/contact.html

Too much code to post here from all the different files involved, so I saved a version of each file as a TXT file, with it's original extention in brackets before it for easier code viewing (with the exception of the contact.html file above:

Involved files:
[.js]Rich-Text Editor: /scripts/whizzywig_61.txt
[.js]File that spawns preview window: /scripts/load.txt
[.php]File called by form action: test_mail.txt
[.php]PHPMailer: /lib/PHPMailer_v5.1/class.phpmailer.txt
[.php]Config file: /config.txt
[.inc]Include file: MailClass.inc.txt

Basic flow is:

Customer goes to the Contact Page, then enters in rich text, and clicks "Preview" - this spawns a new window "DEMO" and writes the contents of the WizzyWig Iframe to a hidden field. From there, the customer can click "Submit", and it send the email to a Godaddy email account.

Here's the problem: I've got a .replace command in the load.js file that replaces the double quotes with singles. If left as doubles, it completely breaks the code. When that email is received, all single quotes are backslashed(escaped?) ( \') so only portions of the HTML (that don't use quotes) show up. (examples: Highlight, insert image, insert link, spans, etc)

I'm not fluent with Javascript, so I've been beating my head against the wall for 5 days now trying to get this to work. It's time to ask for some help lol. I'm not sure where / and in what file is causing this to break. Sent a test HTML email to the same Godaddy email address to make sure it could recieve HTML emails, and it worked fine.

Any help would greatly be appreciated!!

~ John

P.S.: I know there's browser issues with FF etc - I'll correct that once I can get the basic functionality of the pages to work