Im kinda lost on this one. I have a map on my main webpage with a Javascript ShowText Function so that store details are displayed to the right of the main image. However I would like my text to contain hyperlinks and emailto references - can this be done on the ShowText function?
Regards
Paul.
Kor
09-07-2004, 07:05 AM
You have not shown us the code lines so where to modify? :D
Anyway, I can only guess that you must have somewere in code the descriptive texts probably in an array, something like:
var dText = new Array()
dText[0] = 'details here ...';
dText[1] = 'other details here...';
dText[2] = 'some other details here...';
Just insert HTML codes in the strings.
dText[0] = 'details here <a href="newpage.html">New page</a>';
Beware to avoid multiple same-quotes insertion!. For instance, if your code has double quoted string, use backslash marker for inner quotes:
dText[0] = "details here <a href=\"newpage.html\">New page</a>";
servlan
09-07-2004, 08:21 AM
Sorry chaps, heres my code which is a bit different as this is using an Image Map.
What function should I use instead of TextArea for HTMLMarkups?
Regards
Paul
gil davis
09-07-2004, 08:50 AM
There are a few choices.
1) IFRAME - this is supported by modern browsers, and can support either changes to its source document to show different HTML pages within another page, or any other technique for showing HTML in a window (document.write() or innerHTML).
2) DIV, with a change of innerHTML - this is supported by IE and Netscape 6+ but is not a W3C recommendation (yet).
3) DIV, containing predetermined markup but hidden until needed - probably most universal, even version 4 browsers can do this. Think of "balloon help".
servlan
09-07-2004, 09:06 AM
Don't I have the DIV function contained in my code?
Sorry for the newbie questions
Paul
gil davis
09-07-2004, 09:13 AM
The DIV is not the target of your function:
function showtext(place){document.myform.display.value = place}
If you want to target the DIV, you must give the DIV an ID. Then you can do something like this:
function showtext(place) {
document.getElementById("divID").innerHTML = place;
}
servlan
09-07-2004, 09:40 AM
Will this allow me to use HTML markups thou? Or does anyone have any other suggestions ie use ASPX or ControlFunctions
Regards
Paul.
gil davis
09-07-2004, 10:00 AM
Will this allow me to use HTML markups thou?Yes.
servlan
09-07-2004, 10:17 AM
Gil,
Thanks for the sample. Does that mean that I have to now re-structure my code as the Text comes directly from the Map function rather than the DIV?
Im really sorry for asking these silly questions. Im reading up whilst typing to you :)
Regards
Paul
gil davis
09-07-2004, 10:23 AM
Does that mean that I have to now re-structure my code as the Text comes directly from the Map function rather than the DIV?Huh?
In your second post, the text comes from the mouseover embedded in the <AREA> tag. The only thing you absolutely have to change is the script and add an ID for the DIV tag.
<DIV ID="divID" STYLE="...">
The DIV should be empty, although whatever is there initially will be replaced by the text when you mouseover the map.
servlan
09-07-2004, 10:39 AM
Ok, sorry about that.
Since updating my code this has now ignored my /n statements contained in the AREA Tag. Here is my updated file..
In addition, this places a text border and when you move the mouse over to the area the text border dissapears.
gil davis
09-07-2004, 10:57 AM
this places a text border and when you move the mouse over to the area the text border dissapears.
The text border is the <TEXTAREA>. When you mouseover the map, the text is written to the <DIV> and it replaces the <TEXTAREA> so bye, bye border. If you like the border, place a border style on the <DIV>.
ignored my /n statements
The /n is not HTML, it is code for a linefeed. Since it is not HTML, it is rendered as plain text in the <DIV>. If you want a line break, think HTML "<br>".
You are mixing techniques to the detrement of your learning.
servlan
09-07-2004, 11:25 AM
Gil,
Many thanks for that I now have my brain switched on. I guess its hard to remember which tags are associated with the HTML part and the other for Javascript.
Also, you mentioned that the text can contain markups. However, if I wanted certain parts of the text to contain markup's can this be done also?
I only have the HTML code so that if you press the mouse button on the image map this goes to a seperate page. But what happens if I want the user to move the mouse onto the TextArea and hyperlink from there?
Many thanks for the help.
gil davis
09-07-2004, 11:49 AM
if I wanted certain parts of the text to contain markup's can this be done also?Anything you want to place in the <DIV> can have markup applied. You are confusing me by calling it text, as I am afraid you are still referring to the <TEXTAREA> tag rather than the <DIV>.
But what happens if I want the user to move the mouse onto the TextArea and hyperlink from there?Any HTML markup placed in the <DIV> will function as you would expect. If there is a link there, you can click it.
servlan
09-07-2004, 03:54 PM
Ok I got that imbeded into my brain now. However the DIV tag does not contain the text (ie the store location) - this is held in the AREA tag.
What Im referring to is that if the person highlights one of these store locations I would like an email hyperlink for each store location to appear within the store details text.
gil davis
09-07-2004, 04:03 PM
<area ... onmouseover="showtext('YOU CAN PLACE ANY HTML YOU WANT<br>HERE EVEN <a href=\"http://www.yahoo.com\">A LINK TO YAHOO</a>')">
servlan
09-08-2004, 08:30 AM
Gil,
Sorry that sample does not work - this displays some of the text at the bottom of my screen. Here is my syntax:
<area shape="CIRCLE" onMouseOver="showtext('Test Link <a href=\"http://www.yahoo.com\"> A Link </a>')" alt="Test Link" coords="184,302,5">
Any problems with the syntax?
Regards
Paul.
gil davis
09-08-2004, 08:36 AM
Quotes trauma. My fault.
<area shape="CIRCLE" onMouseOver="showtext('Test Link <a href=\\'http://www.yahoo.com\\'> A Link </a>')" alt="Test Link" coords="184,302,5">
servlan
09-08-2004, 08:50 AM
SUPERB - How can I ever repay you!!
If you ever need help on MS Exchange or Windows Active Directory then Im your man!
Thanks again Gil.
Just one kinda last question, if I wanted to somehow redesign the code so that instead of fetching the (showtext) text from an external DB (ie SQL) or Excel file rather than hardcoding this inside the page, can this be done easily?
Cheers
Paul
gil davis
09-08-2004, 09:27 AM
Getting things from a database requires server-side code. Is your server running IIS?
servlan
09-08-2004, 09:38 AM
Yep, I have some experience of creating DataSet code in ASPX.
We have IIS5 and SQL 2000 - but for development Im using SQLSDK and Win2k IIS.
Regards
Paul.
gil davis
09-08-2004, 09:46 AM
That would be the way to go. You basically open a connection to the database and read in the records, then use request.write or <%=varName%> to get the data into the HTML stream at appropriate spots.
servlan
09-08-2004, 10:07 AM
So If I designed this page properly I would
A) Change this to an ASPX extension and add the appropriate data source etc
B) Reference the variables and link them with the dataset
Could I tidy up my existing code so that the Javascript SHOWTEXT and AREA Imagemap comes from another file rather than encoding this into my main index.htm file?
If so, how do I reference, the same way as I have referenced the CSS?
Regards
Paul.
gil davis
09-08-2004, 10:43 AM
Since you have IIS, it would be easy to use the #include feature. You can split it any way you want. The rest of it depends on how you want to implement reusability, if any.
For example, I wrote a crossword puzzle program that used the URL query string to select a puzzle, and the page did a SQL query (WHERE clause) using the query string for the appropriate records. There was just one page and one database. If there was no query string, the page would redirect to a table of contents page that showed what dates were available. I could add a new puzzle just by updating the database.
Not sure what you need. The database only makes sense if you have lots of text thingies or if they change frequently.
If you want to put more than one map in a page, you will need another DIV (with a different ID) and you will want to add a parameter to the function so you can pass the ID for the DIV you want to change.
servlan
09-09-2004, 06:47 AM
I didn't really want another MAP on the same page but somehow make references to an external file ie map.htm or map.txt so that this cut down the amount of code displayed on the index.htm file
Do you know if this can be done?
Regards
Paul.
gil davis
09-09-2004, 07:32 AM
Like I said, you can split the file up any way you want and use the server-side #include instruction in the index file to put them together.
servlan
09-09-2004, 10:02 AM
Gil,
I did what you said and I changed the main file to index.aspx
The UKmap.map file contains all the AREA tag id's and coordinates.
The page fires up ok, but doesn't operate the Showtext function
Any ideas - or am I being stupid again
Many thanks
Paul.
gil davis
09-09-2004, 10:11 AM
The way to trouble-shoot ASP pages is to View|Source of the results on the browser and compare them to what you think you wanted. Looking at the ASP file does not help if you don't have the results or the include file.
I don't think you want to put the map in the <HEAD> section, but I don't know if that is the problem.
I also don't think it is good form to place scripts in the <BODY> that do not affect the rendering of the HTML.
You really should put the <SCRIPT> in the <HEAD> and the <!-- #INCLUDE ...> in the <BODY>.
servlan
09-09-2004, 10:24 AM
Well frm what I can tell the source file does not even indciate that the Area Tags have been loaded.
All the source file shows is the ShowText function and the relative html tags.
I have changed the code so that the include file is above the body and the Javascrit is contained inside the body.
No change.....
gil davis
09-09-2004, 10:26 AM
There must be an error in your include file, or it isn't where you think it is, or the name is wrong.
webdeveloper.com
Copyright Internet.com Inc., All Rights Reserved.