nav[aria-label="Primary Navigation"] { padding: 0; & ul { list-style: none; width: 100%; display: flex; flex-direction: row; justify-content: start; align-items: start; gap: 30px; padding: 0; & li { margin: 0; } & ul li { list-style: none; } } }

load images in Birt report for navigation

work_ph

Hi,
I am trying to build a navigation in my report in javascript and html.
For the onMouseOver-Effekt I want to exchange an image of the button. The implemented html image is shown in the report, however the image loaded by the script code cant be found. I have the images in the same folder as the report file. Where do I have to copy/ how to embed the image-files so that the report finds them in the end?

Thank you for your help!

Find more posts tagged with

Comments

JasonW

Can you directly enter the url from the browser to the image?

Can you post the report (or script snippet?)

Jason

work_ph

This is the html code I wrote into my BIRT report. The images used for the static load work. But when I exchange the images for the onMouseOver effect the new images cant be load although they are in the same folder. It makes sense because the deployed report file appears somewhere else, but how can I add the images I need for this effect to the report library/document for a proper illustration.

thanks for your help

work_ph

JasonW

You need to put a full url in for the image. ie<br />
<br />
<script type="text/javascript"><br />
function change(x, imgName) {<br />
var doc = document.getElementById(x);<br />
doc.src= imgName;<br />
}<br />
<br />
<br />
</script><br />
<table border="0" cellpadding="0" cellspacing="0" bgcolor="#FFFFFF" height = "46"><br />
<tr><br />
<td onMouseOver="change('1234','http://localhost:8080/ExampleViewer/ppt.gif')">xls.gif</img></td><br />
</tr><br />
<tr><br />
</table><br />
<br />
If you deploy the report to the same context that contains the images you can do something like:<br />
<br />
<br />
<script type="text/javascript"><br />
function change(x, imgName) {<br />
var doc = document.getElementById(x);<br />
doc.src= imgName;<br />
}<br />
<br />
<br />
</script><br />
<table border="0" cellpadding="0" cellspacing="0" bgcolor="#FFFFFF" height = "46"><br />
<tr><br />
<td onMouseOver="change('1234','<value-of>reportContext.getHttpServletRequest().getRequestURL()</value-of>' +'ppt.gif')">xls.gif</img></td><br />
</tr><br />
<tr><br />
</table><br />
<br />
Jason