JavaScript - Different Backgrounds Depending On The Time Of Day

I'm not really a Java writer, so I don't know how to do this myself, though I imagine it would be pretty simple.
I am looking to add a script to a webpage that allows users to input a time manually, and have it converted to GMT/Zulu time and display the converted time. I have seen a lot of time zone conversion scripts online, but they all just convert whatever the current system time is to another time zone. I am looking for a script that allows users to convert a time and show the zulu time, for times other than the current time. The time zone the inputed local time would be in is +4:30 (Kabul). I don't really care about style or aestehtics, just a simple script I can insert into a web page to have a time input field. The converted output time can appear in another field, a popup bubble, etc, again style isn't really an issue. It's really just to help people in my job who need to know what the GMT/Zulu time was for certain local times after the fact. One would think it shouldn't be that hard to just subtract 4:30 in your head, but apparently it is.

Sorry if just asking for code outright like this is frowned upon.

hi,

can some one help me how to get the time and date difference? given two time and date with the following format like in textbox A: 2011-05-03 17:35:47.0 and textbox B: 2011-05-03 16:35:47.0 then the output would be: 0 days, 1 hour, 0 minutes, 0 seconds

regards,
verve

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

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

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,

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

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

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>

What i mean is - If ive got a 100% width div, and a person set only his country and name (i want to display inline), if only 2 of them is set i want 1 to be floating left, and one right, BUT IF 3 ISSET (like Date of Birth) i want the CSS to change to margin left 30px to make a gap between each of them, and if 4 isset then 20px gap, and so on, (got 5 that can be displayed there). I guess you do it JS/JQUERY

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

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>

Not 100% sure why or how to make this work.

I have 5 options in a select drop-down. Only two of them are to disable a text field. I have written it successfully to disable on one option. How would I add the second option? I have tried many different ways, and i know its something small that i am missing.

Below is the code that does not work but shows the 2 options that disable my text field.

Code:

<script type="text/javascript">
    function type_disable() {
		var qr_type = document.getElementById('qr_type');
    var qr_owner = document.getElementById('qr_owner');
    if(qr_type.value == 'bio' || 'rebrand')
        qr_owner.disabled = true
    else
        qr_owner.disabled = false
}
	
</script>

Code:

<tr>
	
	<td align="right"><span class="re">*</span>Type: </td>
	<td align="left"> &nbsp;<select id="qr_type"  name="qr_type" onChange="type_disable()">
	
	<option value="0">Select Type</option>
		 <option value="property">Property Code</option> 
		 <option value="ipw">IPW Code</option> 
		 <option value="bio">Biography Code</option> 
		 <option value="rebrand">Rebrand Code</option> 
		 <option value="property_rebrand">Property-rebrand Code</option> 
		 </select>
	 
	 </td>
	<td ></td>
	</tr>

	
	<tr>
	
	<td align="right"><span class="re">*</span>Owner: </td>
	<td align="left"> &nbsp;<input type="textbox" name="qr_owner" id="qr_owner" size="30" value=""/></td>
	<td ></td>
	</tr>

Thanks for any help!

I'm wanting to put a piece of code on my website that will display when our next meeting will be. We have 2 meetings per month. I'm thinking what I need to do is create a code that gets the current month, day of month, and year then combines it together somehow, and if that combination is in a certain range a particular statement, "Next meeting is MM, DD YY." or "Next meeting is today." is displayed.

If date is equal to or between 01012012 and 01112012, "Next meeting is January, 12 2012" is displayed.
If date is equal to 01122012, "Next meeting is today" is displayed.
If date is equal to or between 01132012 and 01252012, "Next meeting is January, 26 2012" is displayed.
If date is equal to 01262012, "Next meeting is today" is displayed.
...that kind of thing.

How would I combine the month, day of month, and year?
Would 48 if statements be what I need to do?

Sorry, I'm pretty new to javascript. If there's a better way to do this, please let me know.

Thanks,

CJ