0

I downloaded a calendar javascript. My working directory is /user. I put the script into /user/js/calendar. In my HTML located at user/, I have...

<script language="JavaScript" src="js/calendar/calendar_us.js"></script>
<link rel="stylesheet" href="js/calendar/calendar.css">

The .js and .css load, and I see the calendar form, but the images under user/js/calendar/img do not load when it's displayed on the browser.

The image reference code in the downloaded javascript is below

<img src="' + this.a_tpl.imgpath + 'next_year.gif" />

this.a_tpl.imgpath is 'img/'. Is there something I need to add or modify in my HTML or in the .js file to make correct relative reference to the files in user/js/calendar/img?

laketuna
  • 3,832
  • 14
  • 59
  • 104
  • Is there an example you can link to? – Matt Stein Aug 17 '11 at 23:02
  • @Matt, I just found the documentation (doh!) for this script! http://www.softcomplex.com/products/tigra_calendar/docs/. I suppose the answer is in there. I will look at it after a short meeting. – laketuna Aug 17 '11 at 23:04

2 Answers2

1

You can't put javascript string functions directly in your HTML like this:

<img src="' + this.a_tpl.imgpath + 'next_year.gif" />

You can use a piece of javascript to document.write() the image tag inline or you can create the tag dynamically in javascript and set the .src property using JS after the document has been loaded. But, you can't just throw some javascript into the middle of your HTML like this.

For static definitions of image URLs in an HTML file, the paths should either be relative to the page location or they should be relative to the top of your domain or they should be a fully qualified domain/path.

jfriend00
  • 683,504
  • 96
  • 985
  • 979
  • I updated my post. I'm not putting this in my HTML code. This is part of the calendar form javascript that I downloaded. I just realized I was so stupid. I just modified the definition at the beginning of the .js for this.a_tpl.imgpath to be "/js/calendar/img". – laketuna Aug 17 '11 at 23:31
1

The image tag is trying to load the image from /user/img/next_year.gif. Either move the images there, or add the path to the code:

<img src="js/calendar/' + this.a_tpl.imgpath + 'next_year.gif" />

Note that image tags will load images relative to where the page was loaded from, while images used in a stylesheet will load images relative to where the style sheet file was loaded from.

Guffa
  • 687,336
  • 108
  • 737
  • 1,005