Add Text/Title to Image

[opton]

I have the following code which displays an image on the webpage:
<icon image="

http://www.mysite.com/sample.gif"

class="local"/>

I would like text to be displayed when the mouse hovers over the image (in standard HTML this would be done using: alt="description of gif" or title="description of gif" after the .gif file)

How can i do this in XML? If you need the XSL file to answer just let me know and i'll copy paste the addtional code.

Thank you.

 

[JontyMC]

XML doesn't display images on a webpage. Browsers interpret HTML. Your XSL will be transforming XML to HTML, so you do it in exactly the same way, ie:

<icon image="[URL unfurl="true"]http://www.mysite.com/sample.gif"[/URL] class="local" alt="blah"/>

<img src="{icon/@image}" alt="{icon/@alt}"/>

Post your XML and XSL if you want a better answer.

Jon

"Asteroids do not concern me, Admiral. I want that ship, not excuses.

 

[opton]

I'm not very good with XML and XSL so i think i should go with the 'better answer' option

I believe this is the applicable XSL code:

  <?xml version="1.0" ?> 
- <xsl:stylesheet version="1.0" xmlns:xsl="[URL unfurl="true"]http://www.w3.org/1999/XSL/Transform">[/URL]
- <xsl:template match="/">
  <xsl:apply-templates select="location" /> 
  </xsl:template>
- <xsl:template match="location">
- <div style="padding-right: 8px; width: 14em">
  <xsl:apply-templates select="info" /> 
  </div>
  </xsl:template>

This is the XML code:

<location infoStyle="[URL unfurl="true"]http://www.mysite.com/file.xsl"[/URL] id=""><icon image="[URL unfurl="true"]http://www.mysite.com/sample.gif"[/URL] class="local"/>

Thanks!

 

[JontyMC]

Post the 'info' template. Also, where does the text come from that you want to be displayed?

Jon

"Asteroids do not concern me, Admiral. I want that ship, not excuses.

 

[opton]

I believe the image is called before the 'info template', but you know better than i do what is going on and how to fix it. Here is the code you requested.

Info Template:

<xsl:template match="info">
<xsl:variable name="page" select="../@arg0" /> 
<div style="margin-right: 6px">
<b>
<xsl:value-of select="title" /> 
</b>
</div>
<div style="font-size: 80%">
<ul>
<xsl:apply-templates select="news" /> 
</ul>
</div>
</xsl:template>

The text for the 'alt' is not shown above (as the above is how the current code appears before i started trying to this portion of the task), but i intend to use the following unless you instruct otherwise:

<icon image="[URL unfurl="true"]http://www.mysite.com/sample.gif"[/URL] class="local" alt="text i want to appear"/>

Once again, thank you!

 

[JontyMC]

OK, post the whole XSL file (need to locate where the info node is being used)

Jon

"Asteroids do not concern me, Admiral. I want that ship, not excuses.

 

[opton]

Thanks....

 <?xml version="1.0" ?> 
- <xsl:stylesheet version="1.0" xmlns:xsl="[URL unfurl="true"]http://www.w3.org/1999/XSL/Transform">[/URL]
- <xsl:template match="/">
  <xsl:apply-templates select="location" /> 
  </xsl:template>
- <xsl:template match="location">
- <div style="padding-right: 8px; width: 14em">
  <xsl:apply-templates select="info" /> 
  </div>
  </xsl:template>
- <xsl:template match="info">
  <xsl:variable name="page" select="../@arg0" /> 
- <div style="margin-right: 6px">
- <b>
  <xsl:value-of select="title" /> 
  </b>
  </div>
- <div style="font-size: 80%">
- <ul>
  <xsl:apply-templates select="news" /> 
  </ul>
  </div>
  </xsl:template>
- <xsl:template match="piece">
- <li>
- <a href="{link}" target="_blank">
  <xsl:value-of select="name" /> 
  </a>
  </li>
  </xsl:template>
  </xsl:stylesheet>

If you need more info just let me know.

Thank you.

 

[JontyMC]

This doesnt have any image in.

Post the full XML file too.

Jon

"Asteroids do not concern me, Admiral. I want that ship, not excuses.

 

[opton]

<?xml version="1.0"?>
<page>
<overlay>
<location infoStyle="[URL unfurl="true"]http://www.mysite.com/file.xsl"[/URL] id="">
<icon image="[URL unfurl="true"]http://www.mysite.com/sample.gif"[/URL] class="local"/>
<info>
<title>Some title here.</title>
<address><line>Hello.</line></address>
</info>
</location>
</overlay>
</page>

The above is the original file the code was taken from. I did notice there was no 'icon' or 'image' in the XSL and maybe that is why it is so confusing to me. Without an icon or image tag, would/should the image still show? (it does)

An 'icon' tag is not a standard HTML tag, is it? If i'm learning (and i hope i am), it seems to me that there should be 'instructions' in the XSL file on how to 'interpret' the icon tag, correct? (sort of?)

Can the tags just be added now to the XSL file, or are things really messed upo because the .gif file shouldn't be appearing at all without the 'instructions' on how to interpret it? Again, if i'm learning, the 'icon' tag in in the XSL would go someplace within the 'location' tag?

Thanks!!

 

[JontyMC]

The XSL file will produce no output for this XML file. What is the setup for your webpage?

Jon

"Asteroids do not concern me, Admiral. I want that ship, not excuses.

 

[opton]

The xml is actually passed to a function as a string.

You can see the set-up HERE

Thanks for your continued assistance.

 

[opton]

Still hoping for a solution on this if anyone can assist

 

[ChrisHunt]

Looking at that page that you linked to, I don't think the image is being generated from the XSLT. There's a heap of javascript that puts the icons on the map, and it uses the XSL to style some (presumably pop-up) information about each point.

If you want to change how the icons behave, you'll have to edit the javascript.

-- Chris Hunt
Webmaster & Tragedian
Extra Connections Ltd