JavaScript - Create Title Tags For Dynamic Images?

From the these form fields I want to be able to create an array in Javascript containing the same 'codes' that feature between the option tags (not the value="X")


Code:

<select name="options-1" id="options-1">
<option value="">Select an option</option>
<option value="1">KA-WH</option>
<option value="2">KA-BK</option>
<option value="3">KA-GN</option>
</select>
 
<select name="options-2" id="options-2">
<option value="">Select an option</option>
<option value="4">BADGE-1</option>
<option value="5">BADGE-2</option>
<option value="6">BADGE-3</option>
</select>

<select name="options-3" id="options-3">
<option value="">Select an option</option>
<option value="7">E-WH</option>
<option value="8">E-GD</option>
<option value="9">E-BK</option>
</select>

for example, from the above, I want a JS array for 'option-1' that contains KA-WH, KA-BK and KA-GN; plus an array for 'option-2' that contains BADGE-1, BADGE-2 and BADGE-3.

The above form fields will be created dynamically, may contain more or fewer items.

I then want to use the JS arrays to pull in images of which filenames match the 'code' in the array.

I need to make it so that when a user moves the mouse over an image it appears enlarged in a seperate div tag when the user moves their mouse over the image

The problem is that the image just enlarges and makes a copy of itself in the div tag it is already in...

this is the code:

<td width="55" height="55"><div id="hello"><img src="jpegs for Thu/Copy of Misc/ajam.jpg" onmouseover="<div id = "Enlargedimage"><img src="jpegs for Thu/Copy of Misc/ajam.jpg"/> width="55" height="55"/></div></td>

any help would be greatly appreciated

How to I use the tipsy (http://onehackoranother.com/projects/jquery/tipsy/) to read from the title tag in the

Code:

<a href="#", title="Hello<br>World">Hello World</a>

From what I can do is to use the tipsy code:
Code:

$('#example-html').tipsy({html: true });

The final code which I wish to create may look something like the following:
Code:

for (var i=0; i<10; i++){
document.write("<a href='#', title='Hello<br>" + i + "' class='example-html'> Hello " + i + "</a>");
}

Appreciate any help offer

Hello

I have a working code which generates barcode 39 using javascript and CSS(to display the bars).

The thing is... the program generates it bar by bar making it very difficult to manage. I would love to have the entire barcode an an image instead.

For example: If somebody's id= 12340, the program takes each number and creates an equivalent black or white bar one after the other, and then displays it.

I want to have it as an image(jpeg,gif etc) but don't know how to

If anyone have something to say, you are most welcome.

Anxiously waiting

Hello,
I've been trying to figure this script out for awhile and I've hit a wall. Basically, what I want to do for my organization's website is to use JS to display an image containing our hours and have it change each day of the week.

The hard part (for me) is that there are certain days we're closed. Ideally, I'd like a separate "We're Closed" message to overwrite the image carrying our hours on specific days (major holidays like Xmas, New Years, Vet's Day, furlough periods, etc. etc.).

Here's the code I've managed to cobble together (I have a real basic understanding of JS, so I've been pulling scripts from sites offering free copy/pastecode):

[CODE]
<script language="javascript">

mytime=new Date();
mymonth=mytime.getMonth()+1;
mydate=mytime.getDate();
myday=mytime.getDay();
arday = new Array("sunday.png", "monday.png", "tuesday.png",
"wednesday.png", "thursday.png", "friday.png", "saturday.png");

document.write("<img src='" + arday[myday] + "'>");
if (mymonth==12 && mydate==24){document.write("<img src='closure.png'>");
}

</script>
[CODE]

For the most part, this code works just fine. However, if I jump my system clock to December 24, the "closure.png" comes up appears ALONGSIDE the hours image for that day of the week. In other words, I've got two images appearing right next to each other - that's not what I want.

How can I work the code in such a way that when a closure date comes up (in this case, 12/24), just the "closure.png" image shows up by itself?

Thank you all so much for your time and patience.

This page: http://homepage.ntlworld.com/kayseyc...document2.html
seems to indicate that it's possible, but it looks like it also pops up an alert window which would be annoying as hell. Is there a way to, say, once every minute change the title bar text?

You see I have a text file of rotating slogans that appear each time you reload a page on my site and someone suggested that having them change even when the page is already open might be fun. I thought I'd look into it and see if it's possible. The site is http://opalcat.com.

I don't know enough about javascript to know if this is possible. I am fairly good at implementing and installing other people's code, though, and can usually make minor changes to tweak things.

Please let me know if this is a doable thing, and if so, if you'd be willing to help me work it out. Thanks in advance,

OpalCat

I am looking to use a similar method as facebook chat does, where it alternates between the original title text and 'friendsName has sent you a message!...'

how can I do this ?

Hi All,
i know how to create a dynamic form or DIv ..but what i do not know is how to create a dynamic form/ or div into a previous dynamic one..

i need basically to see 5 dynamic forms / DIV in cascade where each one trigger the one coming after..

For what i need that :

i have my user inserting information on the level 1. let say Copagny info
2- then he will be asked if he wants to add a sub level information ( subform) for that compagny or even many subforms at the same level ..
and so on...

3- those sub level ( subforms ) can also call their respective subforms..



Any idea how to design this ?


thanks

I have made a script where you can add extra fields, and next to the row is a span that automatically displays the outcome from a calculation of three fields in that row. i.e. Q x (B - A) = total.

Here is the bit that does the calculation:
Code:

function advCalc(selected) {

	var result = Number(document.formmain.elements["quantity"+selected].value) * (Number(document.formmain.elements["provideamount"+selected].value) - Number(document.formmain.elements["supplyamount"+selected].value)) ;

	result = result.toFixed(2) ;
	result = addCommas(result) ;
	
	document.getElementById("total"+selected).innerHTML = result ;

}

The bit that adds a new row of fields is:
Code:

function addPart(divName){
          var newdiv = document.createElement('div') ;
		  newdiv.setAttribute('id', 'partrow' + counter) ;
		  newdiv.setAttribute('style', 'clear:both;') ;
          newdiv.innerHTML = "<div style='float:left;width:40px;text-align:center;margin:5px 5px 0px 0px;'>\r<input onkeyup=\"advCalc('" + counter + "')\" id=' quantity " + counter + "' type='text' value='1' size='1'/>\r</div>\r<div style='float:left;width:100px;text-align:left;margin:5px 0px 0px 0px;'>\r<input id='manufacturer" + counter + "'type='text' value='' size='9'/>\r</div>\r<div style='float:left;width:95px;text-align:left;margin:5px 5px 0px 0px;'>\r<input id='partnumber" + counter + "'type='text' value='' size='9'/>\r</div>\r<div style='float:left;width:80px;text-align:left;margin:5px 5px 0px 0px;'>\r<input id='supplier" + counter + "'type='text' value='' size='4'/>\r</div>\r<div style='float:left;width:100px;text-align:left;margin:5px 5px 0px 0px;'>\r<input id='type" + counter + "'type='text' value='' size='6'/>\r</div>\r<div style='float:left;width:85px;text-align:left;margin:5px 5px 0px 0px;'>\r<input id='deliverytime" + counter + "'type='text' value='' size='13'/>\r</div>\r<div style='float:left;width:40px;text-align:left;margin:5px 0px 0px 45px;'>\r<select id='supplyCurrency" + counter + "'>\r<option value='pound' selected='selected'>&pound;</option><option value='dol'>$</option><option value='euro'>&euro;</option></select>\r</div>\r<div style='float:left;width:15px;text-align:left;margin:5px 5px 0px 0px;'>\r<input onkeyup=\"advCalc(\'" + counter + "\')\" id=' supplyamount " + counter + "'type='text' value='' size='3'/>\r</div>\r<div style='float:left;width:40px;text-align:left;margin:5px 0px 0px 45px;'>\r<select name='provideCurrency" + counter + "'><option value='pound' selected='selected'>&pound;</option><option value='dol'>$</option><option value='euro'>&euro;</option></select>\r</div>\r<div style='float:left;width:15px;text-align:left;margin:5px 5px 0px 0px;'>\r<input onkeyup=\"advCalc(\'" + counter + "\') id=' provideamount " + counter + "' type='text' value='' size='3'/>\r</div>\r<div style='float:left;width:20px;text-align:left;margin:5px 0px 0px 45px;'>\r<strong>&pound;</strong>\r</div>\r<div style='float:left;width:40px;text-align:left;margin:5px 5px 0px 0px;'><span id=' total " + counter + "'></span></div> \r" ;
          document.getElementById(divName).appendChild(newdiv) ;
          counter++ ;
}

The problem I am having is that it works fine for the first row which is hardcoded as e.g. id="provideamount0" etc.

It isn't working for any other fields added but I can't see what is wrong

Right then!

I have a drop down list. The titles are really long. What I want to happen is, end user to click on a selection, i.e.

"This is a really really long title"

And then by the power of voodoo just the abbreviated is shown in the field.

"TIARRLT"

Can this be done by JUST HTML? Or am I looking at some JS here? If anyone could point me to a tutorial that would be great. Or if you have the code you don't mind sharing... amazing!!!

Thanks all!

Hi,

I'm pretty new to Javascript, by about two weeks, I'm looking for help with a problem I have with the following....

<td title='text1;text2;text3'>text4</td></tr>

I'm trying to display text1-3 in a table cell on a rotation, I have this to count through the cells to get to the relevent one...

[CODE]
function rotateCell() {
var delayed = document.getElementsByTagName('td'); //.title.split(';');
for (var i=24;i<24;i++)
[CODE]

This should allow me to identify the location/cell 24 but can some one tell me how I then extract the tittle data and have them alternate within the cell?

I'm not allowed to edit the HTML.

Very gratefull for any help

PeteW

How to add title to options in Select box , where the options are generated from the data base.
Any idea

hi.
how can i get the value of title of<td> on onmouseover function.

something like that.
Code:

<td title="mytitle" onMouseOver="func(this.title);"></td>

can i do this.
plzzzz help me

Hello All,

I am having a few issues. I have added a piece of code in and it doesn't seem to be working. I have highlighted this in bold. Any Ideas?

<html>
<body>
<SCRIPT LANGUAGE="JavaScript">
<head>
<TITLE>Find the Correct Number Game</TITLE>
</head>


a=(prompt('please enter your name:',0)); // prompt for player name

document.write(' Hello ' ,a);


var guessme=Math.round(Math.random()*(49)+1);
var speech='Choose a number between 1 and 50';

function process(hiddennumber) {
var guessnumber=document.forms.guesstable.guessnumber.value;
var speech='"'+guessnumber+ '" Letters are not allowed. Please enter digits only!.';
document.forms.guesstable.guessnumber.value='';

if (guessnumber==hiddennumber)
{
document.forms.guesstable.prompt.value='Congratulations! '+hiddennumber+' is correct!';
alert ('Well done - the mystery number is '+hiddennumber+'! \n\nIf you want to play again click the button.');
speech='';
document.location=document.location;
}

if (hiddennumber<guessnumber)
{
speech='Less than '+ guessnumber;
}

if (hiddennumber>guessnumber)
{
speech='Greater than '+ guessnumber;
}

if (guessnumber=='')
{
speech='You didn\'t guess anything!'
}

document.forms.guesstable.prompt.value=speech; document.forms.guesstable.guessnumber.focus();

}


</SCRIPT>
</body>
</html>

<FORM onSubmit="" NAME="guesstable">
<CENTER>
<TABLE ALIGN="left" BGCOLOR="#888889" BORDER="5" CELLPADDING="5">
<TR>
<TD BGCOLOR="#004081">
<FONT COLOR="#ffffff" FACE="Arial"><B>Find the Correct Number</B></FONT>
</TD>
</TR>
<TR>
<TD>
<CENTER>
<INPUT TYPE="text" NAME="prompt" SIZE="31" MAXLENGTH="60" VALUE="Find the correct number which is between 1 and 50"><BR>
<INPUT TYPE="text" NAME="guessnumber" SIZE="3" MAXLENGTH="3" VALUE="">
<INPUT TYPE="button" VALUE="Enter" onClick='process(guessme)'>
</CENTER>
</TD>
</TR>
</TABLE>
</CENTER>
</FORM>

I found this code in another thread... basically, I need to be able to display a certain image based on the page's title... for instance if the title is: Lotus 7, I need image lotus.jpg to display in an element on the page, however, if the title is Bodhi 9, I need image bodhi.jpg to display in the same element. Can someone help me implement this code?

Code:

var imgs = new Array();

imgs[0] = new Array();
imgs[0][0] = "Research";
imgs[0][1] = "bluetabs_01";
imgs[0][2] = "greentabs_01.gif";

imgs[1] = new Array();
imgs[1][0] = "Information"
imgs[1][1] = "bluetabs_02";
imgs[1][2] = "greentabs_02.gif";

Code:

var title = document.title;
for (var i=0;i<imgs.length;i++){
  if (title.indexOf(imgs[i][0])!=-1){
    document.images[imgs[i][1]].src = imgs[i][2];
    break;
  }
}