JavaScript - Script To Modify Contents Of Div (formatting Errors)

Hi there, I basically need script that will detect if the user is using Internet Explorer, and then display a different page to the one that would be loaded for any other browser.

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.
---------------------

On the 'Edit Profile' page of my eCommerce Wordpress Theme (http://www.projectdisobey.com/disobeyclothing), no error message appears when I do any of the following in the ''New Password' and 'Confirm New Password' text fields:

1. 'New Password' and 'Confirm New Password' do not match.
2. 'Confirm New Password' field is left empty.
3. New password is less than 5 characters.
4. New password is exactly the same as the current password.

This is the script:

Code:

<script language="javascript" type="application/javascript">
function chk_form_pw()
{
if(document.getElementById('new_passwd').value == '')
{
alert("<?php _e(ENTER_NW_PW_JS_MSG) ?>");
document.getElementById('new_passwd').focus();
return false;
}
if(document.getElementById('new_passwd').value.length &lt; 4 )
{
alert("<?php _e(ENTER_NW_PW_MIN_JS_MSG) ?>");
document.getElementById('new_passwd').focus();
return false;
}
if(document.getElementById('cnew_passwd').value == '')
{
alert("<?php _e(ENTER_CONFIRMNW_PW_JS_MSG) ?>");
document.getElementById('cnew_passwd').focus();
return false;
}
if(document.getElementById('cnew_passwd').value.length &lt; 4 )
{
alert("<?php _e(ENTER_CONFIRMNW_PW_MIN_JS_MSG) ?>");
document.getElementById('cnew_passwd').focus();
return false;
}
if(document.getElementById('new_passwd').value != document.getElementById('cnew_passwd').value)
{
alert("<?php _e(ENTER_NW_AND_CONFIRM_PW_SAME_JS_MSG) ?>");
document.getElementById('cnew_passwd').focus();
return false;
}
}
</script>

I'd be extremely appreciative if anybody could help me fix the script so that it works as it is meant to. Javascript is not something I'm particularly familiar with...

Thanks in advance!

<script type="text/javascript">

Code:

function switch1(div) {
if (document.getElementById('one')) {
var option=['one','two','three','four','five','six','seven','eight','nine','ten','eleven','twelve'];
for(var i=0; i<option.length; i++)
{ obj=document.getElementById(option[i]);
obj.style.display=(option[i]==div)? "block" : "none"; }}}//
function switchImg(i){document.images["wine"].src = i;}

</script>

used in this page

seems to object to option.length

Frank.

I found this script on a tutorial site but it had no summary of browser compatibility or any other issues. I know absolutely nothing about javascript and, although it works fine when I test it, I would appreciate it very much if someone else would review this page and give me feedback.

Code:

<head>
<script type="text/javascript">
lastone='empty'; 
function showIt(lyr) 
{ 
if (lastone!='empty') lastone.style.display='none'; 
lastone=document.getElementById(lyr); 
lastone.style.display='block';
}
</script>
</head>
<body>
<!--links-->
<a href="JavaScript:;" onClick="showIt('divID1')" ">link1</a>
<a href="JavaScript:;" onClick="showIt('divID2')" ">link2</a>
<a href="JavaScript:;" onClick="showIt('divID3')" ">link3</a>
<a href="JavaScript:;" onClick="showIt('divID4')" ">link4</a>
<!--layers-->
<div id="divID1" style="display:none;">content1</div>
<div id="divID2" style="display:none;">.content2</div>
<div id="divID3" style="display:none;">..content3</div>
<div id="divID4" style="display:none;">...content4</div>
</body>

Here is a demo of it in action:
http://www.mousegrey.com/layers.html

Hi. I have a bunch of textboxes that I need to run some JS on with onclick. However, no matter what I do, I cannot get it to work. I have this JS in an external file:
Code:

<script language="javascript" type="text/javascript">
function ClearDefault () {
	if (document.this.value==document.this.defaultValue) 
	{
		document.this.value=''; 
		document.this.style.color='black'
	}
}
</script>

and am using onfocus="ClearDefault()"

Help please. Thanks. :-)

I need help making it possible for the prefixes to be available when the post is being Modify? The user have to go back and change their prefixes to ended after they get the result for the outcome of the buy, sell, trade. When I hit Modify the prefix box was no longer available.

It is on the subject line when I hit modify:
Example. I have a thread title "Testing" and I chose Buy prefix when I started the thread. When I hit Modify, the prefix box is no longer available but the subject does say Buy:Testing. I would have to go and delete the Buy from the subject and manually type Ended.

And also each prefixes a specific color if that's possible (i.e., Buy , Sell , Trade , Ended )

The prefix box now is below the subject line. I would love for it to be next to the subject line like in this forum. THANKS!

<script type='text/javascript'>
/* Add prefixes to posts*/

var prefixes = ['Buy:','Sell:','Trade:','Ended:'];
if( new RegExp('post$','i').test( this.location.href ))
{
document.postForm.nextaction.nextSibling.disabled = true;
var Tab = document.postForm.subject.parentNode.parentNode.parentNode;
var iRow = Tab.insertRow(2);
var iCell;
iCell = iRow.insertCell(0);
iCell.className = 'windowbg';
var Font = document.createElement('font');
Font.size = 2;
Font.appendChild( document.createTextNode('Prefixes:') );
iCell.appendChild( Font );
iCell = iRow.insertCell(1);
iCell.className = 'windowbg';
var Select = document.createElement('select');
Select.id = 'preprepre';
Select.options[0] = new Option('Choose prefix');
for( var s = 0 ; s < prefixes.length ; s ++ )
Select.options[s+1] = new Option(prefixes[s]);
iCell.appendChild( Select );
function checkpre(event)
{
if( document.getElementById('preprepre').selectedIndex == 0 )
document.postForm.nextaction.nextSibling.disabled = true;
else
document.postForm.nextaction.nextSibling.disabled = false;
}
function addpre(event)
{
document.postForm.subject.value = document.getElementById('preprepre').options[ document.getElementById('preprepre').selectedIndex ].innerHTML+document.postForm.subject.value;
}
if(document.addEventListener)
{
document.getElementById('preprepre').addEventListener('change',checkpre,false)
document.postForm.addEventListener('submit',addpre,false);
}else{
document.getElementById('preprepre').attachEvent('onchange',checkpre);
document.postForm.attachEvent('onsubmit',addpre);
}
}
</script>

Hi need help with a loan calculator script, i know the moderator frowns on such requests but i just have to, im willing 2 buy a cup of coffee if it works, i want the code below to display the total loan repayment amount instead of the monthly payment payment = principle * monthly interest/(1 - (1/(1+MonthlyInterest)*Months)) , eg if if l0an is 20$ payment is in 4 months, intrest rate is 15% display = amount to be repaid. thanks

Code:

<script language="JavaScript">
<!--
function showpay() {
 if ((document.calc.loan.value == null || document.calc.loan.value.length == 0) ||
     (document.calc.months.value == null || document.calc.months.value.length == 0)
||
     (document.calc.rate.value == null || document.calc.rate.value.length == 0))
 { document.calc.pay.value = "Incomplete data";
 }
 else
 {
 var princ = document.calc.loan.value;
 var term  = document.calc.months.value;
 var intr   = document.calc.rate.value / 1200;
 document.calc.pay.value = princ * intr / (1 - (Math.pow(1/(1 + intr), term)));
 }

// payment = principle * monthly interest/(1 - (1/(1+MonthlyInterest)*Months))

}

// -->
</script>

The results of this loan payment calculator are for comparison purposes only.
They will be a close approximation of actual loan
repayments if available at the terms entered, from a financial institution. This
is being
provided for you to plan your next loan application. To use, enter values
for the
Loan Amount, Number of Months for Loan, and the Interest Rate (e.g.
7.25), and
click the Calculate button. Clicking the Reset button will clear entered
values.
<p>
<center>
<form name=calc method=POST>
<table width=60% border=0>
<tr><th bgcolor="#aaaaaa" width=50%><font color=blue>Description</font></th>
<th bgcolor="#aaaaaa" width=50%><font color=blue>Data Entry</font></th></tr>
<tr><td bgcolor="#eeeee">Loan Amount</td><td bgcolor="#aaeeaa" align=right><input
type=text name=loan
size=10></td></tr>
<tr><td bgcolor="#eeeee">Loan Length in Months</td><td bgcolor="#aaeeaa"
align=right><input type=text
name=months size=10></td></tr>
<tr><td bgcolor="#eeeee">Interest Rate</td><td bgcolor="#aaeeaa" align=right><input
type=text name=rate
size=10></td></tr>
<tr><td bgcolor="#eeeee">Monthly Payment</td><td bgcolor="#eeaaaa"
align=right><em>Calculated</em> <input
type=text name=pay size=10></td></tr>
<tr><td  bgcolor="#aaeeaa"align=center><input type=button onClick='showpay()'
value=Calculate></td><td bgcolor="#eeeeaa" align=center><input type=reset
value=Reset></td></tr>
</table>
</form>
<font size=1>Enter only numeric values (no commas), using decimal points
where needed.<br>
Non-numeric values will cause errors.</font>
</center>

<p align="center"><font face="arial" size="-2">This free script provided by</font><br>
<font face="arial, helvetica" size="-2"><a href="http://javascriptkit.com">JavaScript
Kit</a></font></p>

I'm trying to create a form where the user enters data in a field and is redirected to a URL based on that entry - example: user enters 1234 and he is directed to mypage.com/1234/index.htm - if that folder does not exist it would give a 'try again' error.

Any help would be greatly appreciated
Thanks in advance
Cyber-guys

hello, I got this javascript code to avoid bots to fill out with trash the forms I have in my website:

<script type="text/javascript">
var a = Math.ceil(Math.random() * 10);
var b = Math.ceil(Math.random() * 10);
var c = a + b
function DrawBotBoot()
{
document.write("Cuanto es "+ a + " + " + b +"? ");
document.write("<input id='BotBootInput' type='text' maxlength='2' size='2'/>");
}
function ValidBotBoot(){
var d = document.getElementById('BotBootInput').value;
if (d == c) return true;
return false;

}
</script>

<P>Are you human?<br />

<script type="text/javascript">DrawBotBoot()</script>

<P>
<INPUT id="Button1" name="SUBMIT" TYPE="SUBMIT" VALUE="ENVIAR" onclick="alert(ValidBotBoot());"/>
<INPUT name="RESET" TYPE="RESET" VALUE="BORRAR">

My problem is that the form sends itself even if you dont type the correct answer, I would like to Validate first and then allow me to send the form after validation.

You can see the form he http://www.futuros.com/mercados_calientes.html
feel free to play with it, i know is the only way to actually see what i'm trying to accomplish.

Thanks,
Alan

Can someone help me to modify this JS to close if user is no longer hovering over child link after 5 seconds?
Code:

$(document).ready(function () {
	$('#menuHolder ul li a').mouseover(function (event) {
		if (this == event.target) {
			$(this).parent().toggleClass('clicked');
			if ($(this).parent().attr('class').indexOf('clicked') != -1) {
				$(this).siblings('ul').animate({"top": "35px"}, {queue:false,duration:(500)}, "swing");
				}
				else {
				$(this).siblings('ul').animate({"top": "0px"}, {queue:false,duration:(500)}, "swing");
			}
			$(this).parent().siblings().removeClass('clicked').find('ul').animate({"top": "0px"}, {queue:false,duration:(500)}, "swing");
		}
	})
	$('#menuHolder ul li:not(:has(ul)) a').mouseout(function (event) {
		if (this == event.target) {
			$(this).parent().toggleClass('clicked');
			$(this).parent().siblings().removeClass('clicked').find('ul').animate({"top": "0px"}, {queue:false,duration:(500)}, "swing");
		}
	});
});
</script>

Edit: Problem solved.

Hi

My html document contain many images which has the attribute src of img tag as the flowing :

PHP Code:
http://images.mysite.com/a/p/ap.eba553af4b719.ec03.jpg?x=210&amp;y=83&amp;q=85&amp;sig=Tua1ukyUEVKTPSsz7xGPsg-- 


All those images has the common source folder http://images.mysite.com/a/p
This is an example :




PHP Code:
<img
src = "http://images.mysite.com/a/p/ap.eba553af4b719.ec03.jpg?x=210&amp;y=83&amp;q=85&amp;sig=Tua1ukyUEVKTPSsz7xGPsg--"
width = "105"
height = "73"

> 


I tried during many days to find the solution using RegExp but I didn't arrives. What I want to do is


I - change for all image from the seem folder the src attribute to match the exact url of the image without special characters, for this example :

PHP Code:
http://images.mysite.com/a/p/ap.eba553af4b719.ec03.jpg?x=210&amp;y=83&amp;q=85&amp;sig=Tua1ukyUEVKTPSsz7xGPsg-- 


Became :

PHP Code:
http://images.mysite.com/a/p/ap.eba553af4b719.ec03.jpg 


II - Control the width and height of the image by changing its height and width attributes resp. from two javascript variables :

PHP Code:
var v_width = 320 // Just for example

var v_height = 250 // Just for example 



This is an example of try didn't work for me, for the first issue :

PHP Code:
var element = document.getElementsByTagName("img");
    for(var i=0;i<element.length;) {
    
    var myString = new String();
    
    var myRegExp = new RegExp("http:\/\/d\.images\.mysite\.com\/a\/p[^\?]*(jpg|png|gif)","i");
    var myRegExp0 = new RegExp("\?.*","i");
    myString = element[i].getAttribute("src");
    
    if(myRegExp.test(myString))
        {
            var newString = myString.replace(myRegExp0,"");    
            element[i].setAttribute("src",newString);
            }
    
    } 


Help me please

Think you

hi,
I need to modify IE print settings(paper size, print orientation) automatically,
by javascript and can not use ActiveX control or reduce IE security setting.
Can any one tell me how to implement this function,Thanks.

I have a page that open two frames. Second frame, most of the page, is empty. First frame contains a form that retrieves user input, when you click the button, it send that input back to the original parent html, which detects the GET parameters, and builds a custom URL.

I want to then load that custom URL in the 2nd empty frame. I figure I need to modify the src atttribute of the 2nd frame in the frameset, but I can't make it work.

Code:

<frameset id='parent' rows='10%,90%'>
    <frame id='frm1' src='./form.html' />
    <frame id='frm2' src='' />
</frameset>
<script>modFrmSrc();</script>

where modFrmSrc() checks for the GET values, builds the URL, and then tries to load the URL in frm2.

Is there a way to get this done?