Solved

Son of javascript text write

Posted on 2008-10-13
3
430 Views
Last Modified: 2011-10-19
Good afternoon Expert,

Please forgive the long code section but don't worry, it is listed to
ask a question of concept. The code works. But I now have nineteen
functions. Perhaps there is no way to use looping or arays or some opther
method of reducing the number of functions or perhaps there is. I remember
in VB class that looping or arrays were a way of reducing the number of subroutines.
Does that apply here? If so can you give me a basic idea of the syntax?

Also a brief and specific question. (Maybe I should make this a separate question. If
so let me know.) In the diagram marked Business Anaylsis Body of Knowledge there
is text that appears, 'Enterprise Anaysis'.that  Ioverlaps the box it is supposed to go in.
Is there some way of putting a line break (<br>) int the line
<area shape ="rect" coords ="65,241,140,338" onMouseOver="writeTextG('Enterprise Analysis')"/>

Thanks

Allen in Dallas



begin code section ++++++++++++++++

<html>
<head>
<script type="text/javascript">
function writeText(txt)
{
document.getElementById("desc").innerHTML=txt;
}

function writeTextB(txt)
{
document.getElementById("descB").innerHTML=txt;
}

function writeTextC(txt)
{
document.getElementById("descC").innerHTML=txt;
}

function writeTextD(txt)
{
document.getElementById("descD").innerHTML=txt;
}

function writeTextE(txt)
{
document.getElementById("descE").innerHTML=txt;
}

function writeTextF(txt)
{
document.getElementById("descF").innerHTML=txt;
}

function writeTextG(txt)
{
document.getElementById("descG").innerHTML=txt;
}

function writeTextH(txt)
{
document.getElementById("descH").innerHTML=txt;
}

function writeTextJ(txt)
{
document.getElementById("descJ").innerHTML=txt;
}

function writeTextK(txt)
{
document.getElementById("descK").innerHTML=txt;
}

function writeTextL(txt)
{
document.getElementById("descL").innerHTML=txt;
}

function writeTextM(txt)
{
document.getElementById("descM").innerHTML=txt;
}

function writeTextN(txt)
{
document.getElementById("descN").innerHTML=txt;
}

function writeTextP(txt)
{
document.getElementById("descP").innerHTML=txt;
}

function writeTextQ(txt)
{
document.getElementById("descQ").innerHTML=txt;
}

function writeTextR(txt)
{
document.getElementById("descR").innerHTML=txt;
}

function writeTextS(txt)
{
document.getElementById("descS").innerHTML=txt;
}

function writeTextT(txt)
{
document.getElementById("descT").innerHTML=txt;
}

function writeTextU(txt)
{
document.getElementById("descU").innerHTML=txt;
}

</script>
</head>
<body>
<div><img src ="images/BABOK_e.gif" width ="780" height ="600" usemap="#RPM" /></div>
<map id ="RPM" name="RPM">
<area shape ="rect" coords ="177,145,641,176" onMouseOver="writeText('Requirements Planning and Management')"/>
<area shape ="rect" coords ="259,221,440,262" onMouseOver="writeTextB('Requirements Elicitation')"/>
<area shape ="rect" coords ="315,270,497,312" onMouseOver="writeTextC('Req_ments Analysis and Doc.')"/>
<area shape ="rect" coords ="441,322,622,362" onMouseOver="writeTextD('Solution Assess. & Eval.')"/>
<area shape ="rect" coords ="235,412,700,440" onMouseOver="writeTextE('Requirements Communication')"/>
<area shape ="rect" coords ="176,411,641,441" onMouseOver="writeTextF('Requirements Communication')"/>
<area shape ="rect" coords ="65,241,140,338" onMouseOver="writeTextG('Enterprise Analysis')"/>
</map>
<div  id="desc" style="position: absolute; height: auto; width: auto; left: 280px; top: 170px; font-family: arial; "></div>
<div id="descB" style="position: absolute; height: auto; width: auto; left: 235px; top: 252px; font-family: arial; font-size: 12; "></div>
<div id="descC" style="position: absolute; height: auto; width: auto; left: 335px; top: 302px; font-family: arial; font-size: 12; "></div>
<div id="descD" style="position: absolute; height: auto; width: auto; left: 470px; top: 352px; font-family: arial; font-size: 12; "></div>
<div id="descF" style="position: absolute; height: auto; width: auto; left: 330px; top: 435px; font-family: arial; "></div>
<div id="descG" style="position: absolute; height: auto; width: auto; left: 70px; top: 305px; font-family: arial; font-size: 12;"></div>

<div><img src ="images/requirements_types.gif" width ="600" height ="500" usemap="#RT" /></div>
<map id ="RT" name="RT">
<area shape ="rect" coords ="40,67,193,110" onMouseOver="writeTextH('Business Requirements')"/>
<area shape ="rect" coords ="40,132,193,174" onMouseOver="writeTextJ('User Requirements')"/>
<area shape ="rect" coords ="40,190,193,231" onMouseOver="writeTextK('Functional Requirements')"/>
<area shape ="rect" coords ="40,254,193,294" onMouseOver="writeTextL('Qual of Serv Requirements')"/>
<area shape ="rect" coords ="40,313,193,354" onMouseOver="writeTextM('Assumpt_ns & Constraints')"/>
<area shape ="rect" coords ="40,380,193,421" onMouseOver="writeTextN('Implement_n Req_ments')"/>

<area shape ="rect" coords ="214,67,560,110" onMouseOver="writeTextP('High level goals. Business purpose & metrics')"/>
<area shape ="rect" coords ="214,132,560,174" onMouseOver="writeTextQ('Gathered by requirements elicitation')"/>
<area shape ="rect" coords ="214,190,560,231" onMouseOver="writeTextR('Behavior and information of solution')"/>
<area shape ="rect" coords ="214,254,560,294" onMouseOver="writeTextS('Environmental conditions')"/>
<area shape ="rect" coords ="214,313,560,354" onMouseOver="writeTextT('Nonfunctional aspects that limit or impact')"/>
<area shape ="rect" coords ="214,380,560,421" onMouseOver="writeTextU('Transition from current to desired, temporary')"/>


</map>

<div id="descH" style="position: absolute; height: auto; width: auto; left: 60px; top: 705px; font-family: arial; font-size: 12;"></div>
<div id="descJ" style="position: absolute; height: auto; width: auto; left: 65px; top: 765px; font-family: arial; font-size: 12; "></div>
<div id="descK" style="position: absolute; height: auto; width: auto; left: 60px; top: 825px; font-family: arial; font-size: 12; "></div>
<div id="descL" style="position: absolute; height: auto; width: auto; left: 60px; top: 885px; font-family: arial; font-size: 12; "></div>
<div id="descM" style="position: absolute; height: auto; width: auto; left: 60px; top: 950px; font-family: arial; font-size: 12; "></div>
<div id="descN" style="position: absolute; height: auto; width: auto; left: 60px; top: 1015px; font-family: arial; font-size: 12;"></div>

<div id="descP" style="position: absolute; height: auto; width: auto; left: 235px; top: 705px; font-family: arial; font-size: 12;"></div>
<div id="descQ" style="position: absolute; height: auto; width: auto; left: 235px; top: 765px; font-family: arial; font-size: 12; "></div>
<div id="descR" style="position: absolute; height: auto; width: auto; left: 235px; top: 825px; font-family: arial; font-size: 12; "></div>
<div id="descS" style="position: absolute; height: auto; width: auto; left: 235px; top: 885px; font-family: arial; font-size: 12; "></div>
<div id="descT" style="position: absolute; height: auto; width: auto; left: 235px; top: 950px; font-family: arial; font-size: 12; "></div>
<div id="descU" style="position: absolute; height: auto; width: auto; left: 235px; top: 1015px; font-family: arial; font-size: 12;"></div>

</body>
</html>

end code section ++++++++++++++++


BABOK-e.gif
Requirements-types.gif
0
Comment
Question by:9apit
3 Comments
 
LVL 24

Accepted Solution

by:
glcummins earned 300 total points
ID: 22706944
You can combine those functions into a single function that takes two parameters:

 1. The text to be written
 2. The ID of the field to write

Like this:

function writeText(txt, fieldId)
{
document.getElementById(fieldId).innerHTML=txt;
}
0
 
LVL 7

Assisted Solution

by:mltsy
mltsy earned 200 total points
ID: 22708844
I agree with glcummins on that question.

As for the text overlapping the box it's supposed to fit in - it looks like you have the positioned to the pixel, you could also add in a pixel width so that the text would wrap properly for the box it's supposed to fit in, something like:

<div id="descG" style="position: absolute; height: auto; width: 90px; left: 70px; top: 305px; font-family: arial; font-size: 12;"></div>
0
 

Author Closing Comment

by:9apit
ID: 31505697
Spilt points to recognize both contributions. Thanks
0

Featured Post

6 Surprising Benefits of Threat Intelligence

All sorts of threat intelligence is available on the web. Intelligence you can learn from, and use to anticipate and prepare for future attacks.

Join & Write a Comment

Introduction HTML checkboxes provide the perfect way for a web developer to receive client input when the client's options might be none, one or many.  But the PHP code for processing the checkboxes can be confusing at first.  What if a checkbox is…
Boost your ability to deliver ambitious and competitive web apps by choosing the right JavaScript framework to best suit your project’s needs.
The viewer will learn the basics of jQuery, including how to invoke it on a web page. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery.: (CODE)
The viewer will learn the basics of jQuery including how to code hide show and toggles. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery…

758 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question

Need Help in Real-Time?

Connect with top rated Experts

22 Experts available now in Live!

Get 1:1 Help Now