I am not sure but can you not use $content.getURI("/images/inactive.gif") ?
E.g:

#set($imagePath = $content.getURI("/images/inactive.gif"))

  <div id="box_01"
onMouseOver="document.getElementById('box_01').style.backgroundIma
>
> age =
> 'url($imagePath)'"
>
>      onMouseOut="
> document.getElementById('box_01').style.backgroundImage =
> 'url($imagePath)'">
>


Vick


On Dec 4, 2007 4:12 AM, Alexander Zimmer <[EMAIL PROTECTED]>
wrote:

> Hello list,
>
>
>
> I would like to swap a background image via JavaScript code, such as:
>
>
>
>  <div id="box_01"
> onMouseOver="document.getElementById('box_01').style.backgroundImage =
> 'url(images/active.gif)'"
>
>      onMouseOut="
> document.getElementById('box_01').style.backgroundImage =
> 'url(images/inactive.gif)'">
>
>   ... some content ...
>
>  </div>
>
>
>
> the problem is: due to Turbine's notion of a path notation, the URL of
> the HTML page would be:
>
>  http://HOST:8080/myapp/template/main.vm
>
>
>
> As we know, this is telling the Turbine servlet to serve the template
> main.vm. But from a browser's point of view, this looks like the page
> main.vm in the path /myapp/template/ was requested - which is
> essentially wrong because /template/ is no path info (but the name part
> of the name-value-pair template=main.vm). Not being aware of this
> gotcha, the JavaScript interpreter would eventually run the onMouseOver
> code and try to load the image images/active.gif. Since this is a
> relative path, the browser requests:
>
>  http://HOST:8080/myapp/template/images/active.gif
>
>
>
> My oh my!! This does not work because this is no valid path.
>
>
>
>
>
> How can I do this?
>
> Just using an absolute path in the JavaScript like this:
>
>
>
>  <div id="box_01"
> onMouseOver="document.getElementById('box_01').style.backgroundImage =
> 'url(/myapp/images/active.gif)'"
>
>      onMouseOut="
> document.getElementById('box_01').style.backgroundImage =
> 'url(/myapp/images/inactive.gif)'">
>
>  </div>
>
>
>
> ...is not a good solution because I have to include the Context name of
> the webapp in the link.
>
> Since the JavaScript-Code will not get parsed by Velocity, I can not use
> something like
>
>  document.getElementById('box_01').style.backgroundImage =
> 'url($ui.images("active.gif"))'"
>
>
>
>
>
> How can I achieve the dynamic loading of images in a more or less
> elegant way?
>
>
>
> TIA,
>
> Alex
>
>

Reply via email to