JavaScript - Changin The Css Depending On The Number Of Set Elements

I am trying to figure out how to make a random number I can plug into a script count down from that number at certain times of the day until it reaches 0. I would like it to reset itself at midnight every day. I'm trying to make it work with a script I found on here that resets itself at midnight every day. So instead of it counting down too fast, it would count down to the next number after a randomly generated number of minutes until it reaches 0. But it wouldn't necessarily have to end at 0 at midnight. It could go from 845 to 323 at the end of the day at a slower pace. Is that possible?

Hi, I need a function to change an id depending on the webrowser.
Code:

<div id="main"....

if the guy uses internet explorer the id of the main there as to be renamed
mainie
if he is with firefox the id of the main as to be renamed
mainfff
and if he uses opera the id of the main as to be ranamed
mainop

I really dont know how to do that, if someone could code that for me it would fix alot of problems. Thanks

Hi, I have the following code, but I wish to change the background image only twice in one day. So, let's say at 6 am the background changes to nanaimo-daytime.png and at 6 pm it changes to nanaimo-night.png - until 6 am when it starts all over again. I'd appreciate any help.

Thanks so much,

Abe

<code>
<script language="JavaScript">
function determineBackground() {
var currentTime = new Date();

if (currentTime.getHours() < 8) {
document.body.background = 'images/nanaimo-night.png';
}
else if (currentTime.getHours() >= 18) {
document.body.background = 'images/nanaimo-night.png';
}

else {
document.body.background = 'images/nanaimo-daytime.png';
}
}
</script>
</code>

Im wanting to make a div move according to where the mouse is IE if the mouse is on the left the div moves right and visa versa. I've got the pixels for where the middle of the screen is but im unsure what to do next.

If anyone can help ill be very grateful, ill try and find an example to help illustrate what i mean.

Hello Everyone!

It's been a while since this thought started to bother me, I would like to create a website that has script which depending on the option chooses the image and merges with the other image.

My idea is that someone comes on my website which would be custom carp hair rings. They would have options such as:

Hook type
Hook size
Braid(fishing line)
Length of the braid
Swivel


So depending on the hook they choose different image will appear and depending on the braid and the hook size everything merges together into finished product where the outcome you could clearly see the image of the hook tied with braid and a swivel at the end.

This is the image

Basically where you see the hook, the customer could select from an option of hooks and it would be replaced by their option, the length of the bread doesn't matter, but it would be nice to have some sort of an indicator to the customer how long it would be, and the last bit is the swivel, depending on the option the customer chooses, he can see the swivel or not.

Its like creating your own carp rig, you choose which hook you want, then it appears, you choose which braid you want, it appears and if you want you can have a swivel at the end and you can see how your chosen options looks like in reality.

Now I do not ask anyone to do everything for me, all I'm asking is for directions. Is there a script somewhere that I could edit that would achieve my goal, since I have no coding skills but some knowledge it would be nice to get some support along the way.

Thank You for you attention

Arnoldas Valys

Hello,

I am trying to search some information about how to do a concept website like this:

http://unfold.no/

Exactly what I want is something similar with vertical scroll but instead of images or the map I want that when you are going down the page you find a background video for example in the first area with an autoplay and if you are continue going down the video stops automatically.

Not sure if there is any type of "control" when you can say: "When Video is on your screen auto-play and when dissapear from you screen stop.

I am not sure if this is posible to do with Javascript or maybe with Flash.

I have not found any example similar than this so not really sure if is a imposible fact.

Thank you for your time

I have recently installed google custom search on a page- using the iframe selection, so I can have control over the look of the page and it isn't a google branded page.

The problem is- with JS disabled, this form doesn't work. However, the option to display results on a google hosted page does work.

This is very important for accessibility for this site, so what I am wanting to do is have the basic search show ONLY if there is no JS enabled. But for everyone else- it displays as I intended.

JS isn't my bread and butter, but I think it's the tool to use here. Could someone offer some guidance?

Main Form
Code:

		<div style="float:right">	      
        <script type="text/javascript" src="/js/main.js"></script>
	      <div id="searchBox" class="searchBoxTopLevelNav"> 
	        <form name="search" id="search" action="search.php?">
            <label for="q" style="display:none";>Site Search</label>
            <input onclick="javascript:SearchClear(this);" onkeypress="javascript:OverrrideForms(this);" name="q" id="q" autocomplete="off" class="GoogleSearchTextBox" value="Search"  /> 
	        <input name='btnG' onclick="javascript:SearchGoogle($(this).prev('input.GoogleSearchTextBox:first'));return false;" type='image' value='Search' src='../img/icons/search-gray.gif' alt='Go' align="top"/> 
            </form>
		</div>

Form to display only if JS is not enabled

Code:

<form action="http://www.google.com/cse" id="cse-search-box">
  <div>
    <input type="hidden" name="cx" value="#" />
    <input type="hidden" name="ie" value="UTF-8" />
    <input type="text" name="q" size="31" />
    <input type="submit" name="sa" value="Search" />
  </div>
</form>
<script type="text/javascript" src="http://www.google.com/cse/brand?form=cse-search-box&lang=en"></script>

Hi All,

I am very new to javascript.

I want to open a pop up window automatically on the date when i have mentioned in the function, means if the date is equal to 24/07/2011, then when i open the website open the pop up window...

How to do that? Please suggest

Hi, i have a container div with many other nested divs inside
e.g.
Code:

<div id="thisOne">
  <div>Div 1</div>
  <div>Div 2</div>
</div>

The outter div is 640 (ish) px wide, and the div will scroll on the across horizontally. I want it to scroll left if the mouse is in the first 100px on the left (0-100px) or right if its in the last 100 px (540-640px).

What would be the best way of doing this? Sorry if that didnt make sense :P

Please help. I'm not sure why it's not populating.

Code:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>Blood Control</title>
<meta name="keywords" content="">
<meta name="description" content="">
<META HTTP-EQUIV="Expires" CONTENT="0">
<META HTTP-EQUIV="Pragma" CONTENT="no-cache">
<!--- global javascript functions --->
<script language="JavaScript" type="text/javascript" src="https://www.bd.com/includes/global.js"></script>
<!--- global style sheet --->
<LINK rel="stylesheet" type="text/css" href="https://www.bd.com/includes/styles.css" media="screen">
<!--- print style sheet --->
<LINK rel="stylesheet" type="text/css" href="https://www.bd.com/includes/print.css" media="print">
<!--- browser specific style sheets --->
<STYLE TYPE="text/css">
BODY {
	font-size: 75%;
	font-family : Verdana, Arial, Helvetica;
	color: #333333;
}
TD {
	font-size: 75%;
	font-family : Verdana, Arial, Helvetica;
	color: #333333;
}
</STYLE>
<!----- HBX Include ----->
<!-- HBX INCLUDE DATA HERE www.bd.com -->
<!--WEBSIDESTORY CODE HBX1.0 (Universal)-->
<!--COPYRIGHT 1997-2005 WEBSIDESTORY,INC. ALL RIGHTS RESERVED. U.S.PATENT No. 6,393,479B1. MORE INFO:http://websidestory.com/privacy-->
<script language="javascript">
var _hbEC=0,_hbE=new Array;function _hbEvent(a,b){b=_hbE[_hbEC++]=new Object();b._N=a;b._C=0;return b;}
var hbx=_hbEvent("pv");hbx.vpc="HBX0100u";hbx.gn="aa.bd.com";

//BEGIN EDITABLE SECTION
//CONFIGURATION VARIABLES
hbx.acct="DM531126I7FB72EN3";//ACCOUNT NUMBER(S)
hbx.pn="PUT+PAGE+NAME+HERE";//PAGE NAME(S)
hbx.mlc="CONTENT+CATEGORY";//MULTI-LEVEL CONTENT CATEGORY
hbx.pndef="index.asp";//DEFAULT PAGE NAME
hbx.ctdef="full";//DEFAULT CONTENT CATEGORY

//OPTIONAL PAGE VARIABLES
//ACTION SETTINGS
hbx.fv="";//FORM VALIDATION MINIMUM ELEMENTS OR SUBMIT FUNCTION NAME
hbx.lt="auto";//LINK TRACKING
hbx.dlf="n";//DOWNLOAD FILTER
hbx.dft="n";//DOWNLOAD FILE NAMING
hbx.elf="n";//EXIT LINK FILTER
hbx.lc="y";//FORCE LOWERCASE

//SEGMENTS AND FUNNELS
hbx.seg="";//VISITOR SEGMENTATION
hbx.fnl="";//FUNNELS

//CAMPAIGNS
hbx.cmp="";//CAMPAIGN ID
hbx.cmpn="";//CAMPAIGN ID IN QUERY
hbx.dcmp="";//DYNAMIC CAMPAIGN ID
hbx.dcmpn="";//DYNAMIC CAMPAIGN ID IN QUERY
hbx.dcmpe="";//DYNAMIC CAMPAIGN EXPIRATION
hbx.dcmpre="";//DYNAMIC CAMPAIGN RESPONSE EXPIRATION
hbx.hra="";//RESPONSE ATTRIBUTE
hbx.hqsr="";//RESPONSE ATTRIBUTE IN REFERRAL QUERY
hbx.hqsp="";//RESPONSE ATTRIBUTE IN QUERY
hbx.hlt="";//LEAD TRACKING
hbx.hla="";//LEAD ATTRIBUTE
hbx.gp="";//CAMPAIGN GOAL
hbx.gpn="";//CAMPAIGN GOAL IN QUERY
hbx.hcn="";//CONVERSION ATTRIBUTE
hbx.hcv="";//CONVERSION VALUE
hbx.cp="";//LEGACY CAMPAIGN
hbx.cpd="";//CAMPAIGN DOMAIN

//CUSTOM VARIABLES
hbx.ci="";//CUSTOMER ID
hbx.hc1="";//CUSTOM 1
hbx.hc2="";//CUSTOM 2
hbx.hc3="";//CUSTOM 3
hbx.hc4="";//CUSTOM 4
hbx.hrf="";//CUSTOM REFERRER
hbx.pec="";//ERROR CODES

//INSERT CUSTOM EVENTS

//END EDITABLE SECTION

//REQUIRED SECTION. CHANGE "YOURSERVER" TO VALID LOCATION ON YOUR WEB SERVER (HTTPS IF FROM SECURE SERVER)
</script>
<script language="javascript1.1" src="https://www.bd.com/includes/hbx.js"></script>
<!--END WEBSIDESTORY CODE-->
<!----- WT Include ----->
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<script language="javascript">

var rand_no = Math.floor(Math.random()*999999);

// Declaring required variables
var digits = "0123456789";
// non-digit characters which are allowed in phone numbers
var phoneNumberDelimiters = "()#- .";
// characters which are allowed in international phone numbers
// (a leading + is OK)
var validWorldPhoneChars = phoneNumberDelimiters + "+";
// Minimum no of digits in an international phone no.
var minDigitsInIPhoneNumber = 0;

function form_action(form)
		{
		if (form.Share_Story.checked) 
			{
				document.getElementById('share_story_enabled').style.display = 'block';
				
			}
			else
			{
			document.getElementById('share_story_enabled').style.display = 'none';
			}
			
			if (form.Share_Comment.checked) 
			{
				document.getElementById('share_comment_enabled').style.display = 'block';
				
			}
			else
			{
			document.getElementById('share_comment_enabled').style.display = 'none';
			}
			
			if (form.Sign_Up.checked) 
			{
				document.getElementById('sign_up_enabled').style.display = 'block';
				
			}
			else
			{
			document.getElementById('sign_up_enabled').style.display = 'none';
			}
		
		}
</script>
<script language="javascript">

function clearselect()
{
document.myform.State.options.length = 0;
}

function changeStates()
{
var indx=document.myform.Country.selectedIndex
var Country=document.myform.Country.options[indx].value

if (Country=="United States")
{
clearselect();
document.myform.State.options[0] = new Option('----- Select One -----','');
document.myform.State.options[1] = new Option('Alabama','AB');
document.myform.State.options[2] = new Option('Alaska','AK');
document.myform.State.options[3] = new Option('Arizona','AZ');
document.myform.State.options[4] = new Option('Arkansas','AR');
document.myform.State.options[5] = new Option('California','CA');
document.myform.State.options[6] = new Option('Colorado','CO');
document.myform.State.options[7] = new Option('Connecticut','CT');
document.myform.State.options[8] = new Option('Delaware','DE');
document.myform.State.options[9] = new Option('District of Columbia','DC');
document.myform.State.options[10] = new Option('Florida','FL');
document.myform.State.options[11] = new Option('Georgia','GA');
document.myform.State.options[12] = new Option('Hawaii','HI');
document.myform.State.options[13] = new Option('Idaho','ID');
document.myform.State.options[14] = new Option('Illinois','IL');
document.myform.State.options[15] = new Option('Indiana','IN');
document.myform.State.options[16] = new Option('Iowa','IA');
document.myform.State.options[17] = new Option('Kansas','KS');
document.myform.State.options[18] = new Option('Kentucky','KY');
document.myform.State.options[19] = new Option('Louisiana','LA');
document.myform.State.options[20] = new Option('Maine','ME');
document.myform.State.options[21] = new Option('Maryland','MD');
document.myform.State.options[22] = new Option('Massachusetts','MA');
document.myform.State.options[23] = new Option('Michigan','MI');
document.myform.State.options[24] = new Option('Minnesota','MN');
document.myform.State.options[25] = new Option('Mississippi','MS');
document.myform.State.options[26] = new Option('Missouri','MO');
document.myform.State.options[27] = new Option('Montana','MT');
document.myform.State.options[28] = new Option('Nebraska','NE');
document.myform.State.options[29] = new Option('Nevada','NV');
document.myform.State.options[30] = new Option('New Hampshire','NH');
document.myform.State.options[31] = new Option('New Jersey','NJ');
document.myform.State.options[32] = new Option('New Mexico','NM');
document.myform.State.options[33] = new Option('New York','NY');
document.myform.State.options[34] = new Option('North Carolina','NC');
document.myform.State.options[35] = new Option('North Dakota','ND');
document.myform.State.options[36] = new Option('Ohio','OH');
document.myform.State.options[37] = new Option('Oklahoma','OK');
document.myform.State.options[38] = new Option('Oregon','OR');
document.myform.State.options[39] = new Option('Pennsylvania','PA');
document.myform.State.options[40] = new Option('Puerto Rico','PR');
document.myform.State.options[41] = new Option('Rhode Island','RI');
document.myform.State.options[42] = new Option('South Carolina','SC');
document.myform.State.options[43] = new Option('South Dakota','SD');  
document.myform.State.options[44] = new Option('Tennessee','TN');     
document.myform.State.options[45] = new Option('Texas','TX');         
document.myform.State.options[46] = new Option('Utah','UT');          
document.myform.State.options[47] = new Option('Vermont','VT');       
document.myform.State.options[48] = new Option('Virginia','VA');      
document.myform.State.options[49] = new Option('Washington','WA');    
document.myform.State.options[50] = new Option('West Virginia','WV'); 
document.myform.State.options[51] = new Option('Wisconsin','WI');     
document.myform.State.options[52] = new Option('Wyoming','WY');       
}
else if (Country=="Canada")
{
clearselect();
			document.myform.State.options[0] = new Option('---------------Select One-------------','');
			document.myform.State.options[1] = new Option('Alberta','AB');       
			document.myform.State.options[2] = new Option('British Columbia','BC');       
			document.myform.State.options[3] = new Option('Manitoba','MB');       
			document.myform.State.options[4] = new Option('New Brunswick','NB');       
			document.myform.State.options[5] = new Option('New Foundland','NL');       
			document.myform.State.options[6] = new Option('NorthWest Territories','NT');       
			document.myform.State.options[7] = new Option('Nova Scotia','NS');       
			document.myform.State.options[8] = new Option('Ontario','ON');       
			document.myform.State.options[9] = new Option('Prince Edward Island','PE');       
			document.myform.State.options[10] = new Option('Quebec','QC');       
			document.myform.State.options[11] = new Option('Saskatchewan','SK');       
			document.myform.State.options[12] = new Option('Yukon','YT');       
}


else if (Country!="Canada" && Country!="United States")
{
	clearselect();
	document.myform.State.options[0] = new Option('Not Applicable','Not Applicable');
}
}


</script>
</head>
<body bgcolor="#ECF3FB" link="#2F61BD" vlink="#2F61BD" alink="#FF6600" marginheight="0" marginwidth="0" topmargin="0" leftmargin="0" onLoad="pageLoaded();">
<table border=0 cellpadding=0 cellspacing=0 width=768 align="center" bgcolor="#FFFFFF">
  <tr>
    <td width=4 height=7 background="https://www.bd.com/images/shadow_left.gif" valign=top><img src="https://www.bd.com/images/shadow_top_left.gif" alt="[spacer image]" width="4" height="7" hspace="0" vspace="0" border="0"></td>
    <td width=760 rowspan=2 valign=top><!--- Global Header Include --->
      <script type="text/javascript" src="https://www.bd.com/includes/anylink.js">
/***********************************************
* AnyLink CSS Menu script- © Dynamic Drive DHTML code library (www.dynamicdrive.com)
* This notice MUST stay intact for legal use
* Visit Dynamic Drive at http://www.dynamicdrive.com/ for full source code
***********************************************/
</script>

hello
i have this code that tags between three images in an certain amount of time
and this works fine
Code:

<script language = "Javascript">
<?php $count_im=1;
 $req=mysql_query("select * from banner");
	while ($res=mysql_fetch_array($req)){ ?>
var image<?php echo $count_im; ?> =new Image()
image<?php echo $count_im; ?>.src="<?php echo $res["banner"]; ?>"
<?php $count_im++;
}?>
</script>

Code:

<div class="banner">
	<p class="banner_image">
		<img src="banner/12.jpg" name="slide" width="290px">
		<script>
			<!--
			//variable that will increment through the images
			var step=1
			function slideit(){
			//if browser does not support the image object, exit.
			if (!document.images)
			return
			document.images.slide.src=eval("image"+step+".src")
			if (step<3)
			step++
			else
			step=1
			//call function "slideit()" every ... seconds
			setTimeout("slideit()",10000)
			}
			slideit()
			//-->
		</script>
	</p>
</div>

and i want it also to tag between hrefs too, so tried the following but didnt work
Code:

<?php $count_im=1;
 $req=mysql_query("select * from banner");
	while ($res=mysql_fetch_array($req)){ ?>
var image<?php echo $count_im; ?> =new Image()
image<?php echo $count_im; ?>.src="<?php echo $res["banner"]; ?>"

var link<?php echo $count_im; ?> =new String()
link<?php echo $count_im; ?>.href="<?php echo $res["banner_title"]; ?>"

<?php $count_im++;
}?>

Code:

<div class="banner">
	<p class="banner_image">
		<a href="" rel="nofollow" target="_blank" name="links">
		<img src="banner/12.12" name="slide" width="290px"></a>
		<script>
			<!--
			//variable that will increment through the images
			var step=1
			function slideit(){
			//if browser does not support the image object, exit.
			if (!document.images)
			return
			document.images.slide.src=eval("image"+step+".src")
			document.a.links.href=eval("link"+step+".src")
			if (step<3)
			step++
			else
			step=1
			//call function "slideit()" every ... seconds
			setTimeout("slideit()",10000)
			}
			slideit()
			//-->
		</script>
	</p>
</div>

anyone can help???

Hi
I have a multipage form. I can put data entered in hidden form elements from previous pages. I want to show or hide table rows depending on this data value.
For example, I collect a list of names in first form, but if some names are blank I dont want to show the table row associated with that name to collect more data.
I have seen loads of code to toggle rows but cant find any which shows me how to toggle on a variable.
Thanks in advance.

I'm trying to use javascript to have my webpage black at night and bright blue (#2A7FFF) in the day time. How would I go about this? :/

I have also tried to use javascript to change a picture depending on the time of day, this is what I have used.

IN THE <head>

Code:

<script type="text/javascript">
var hourofday = thedate.getUTCHours();
function sun()
{
   // return TRUE if it's day

   if (hourofday > 7 && hourofday < 10) {
     return true;
   }
   return false;
}
</script><script type="text/javascript">
var hourofday = thedate.getUTCHours();
function sun()
{
   // return TRUE if it's day
   if (hourofday > 7 && hourofday < 10) {
     return true;
   }
   return false;
}
</script>

IN THE <body>

Code:

<div id="layer1" style="position:absolute; top:5px; left:5px; width:190px; height:190px; z-index:1; padding:5px; border:#000000 2px solid;background:color:#000000;">
<script type="text/javascript">
if (sun()) {
  document.write("<img src="www.oliverbinns.webs.com/images/sun.png" />");
} else {
  document.write("<img src="www.oliverbinns.webs.com/images/moon.png" />");
}
</script>
</div>

Hello,

I have a form that works out some basic math questions e.g. area etc.

I run a function when a form field is updated to do the calculations, however I'd like to run a different calculation depending on which form element was updated.

Is there a way to say something like:

if (area1 was updated) {
work out this calculation
}
if(area2 was updated) {
work out this calculation
}

and so on?

Thanks,

Nicola