Updating image every month automatically in js

[kavithadevan]

Hi
I am trying to create some websites in that website i have images field in that image field(totally i have 12 images) in my website i want to update my images according to month.If the month is january i want to display first picture .if it is feb then it shows 2nd image like this.I created like for a week but i cant find idea for this can anyone help me and can anyone send some example code for this.

thanks

[sumittyagi]

Hi
I am trying to create some websites in that website i have images field in that image field(totally i have 12 images) in my website i want to update my images according to month.If the month is january i want to display first picture .if it is feb then it shows 2nd image like this.I created like for a week but i cant find idea for this can anyone help me and can anyone send some example code for this.

thanks

rename your images to img0.gif, img1.gif, .... img11.gif;

<img src="" id="monthImage">
<script language=javascript type="text/javascript">
document.getElementById("monthImage").src = "abc/img" + new Date().getMonth() + ".gif";
</script>

[gits]

hi ...

you may use an js-object, and the date-object like the following:

// create actual date
var date = new Date;
 
// img-list ... example
var cal_images = {
    0: 'default.jpg',
    1: 'imgsrc1.jpg',
    2: 'imgsrc2.jpg',
    3: 'imgsrc3.jpg'
};
 
// you need a reference to the image-node ... then set the src
// according to date's month
var month   = date.getMonth() + 1;
img_ref.src = typeof cal_images[month] != 'undefined' ? 
        cal_images[month] : cal_images[0] ;
 

kind regards

[sumittyagi]

hi ...

you may use an js-object, and the date-object like the following:

// create actual date
var date = new Date;
 
// img-list ... example
var cal_images = {
    0: 'default.jpg',
    1: 'imgsrc1.jpg',
    2: 'imgsrc2.jpg',
    3: 'imgsrc3.jpg'
};
 
// you need a reference to the image-node ... then set the src
// according to date's month
var month   = date.getMonth() + 1;
img_ref.src = typeof cal_images[month] != 'undefined' ? 
        cal_images[month] : cal_images[0] ;
 

kind regards

Yea, your solution is better gits.

[kavithadevan]

Hi,
Sorry you gave some solution i tried with that but it shows error

in here

img_ref.src = typeof cal_images[month] != 'undefined' ? 
        cal_images[month] : cal_images[0] ;
 

img_ref.src is undefined can u tell me what is that img_ref.src

Yea, your solution is better gits.

[gits]

img_ref has to be a reference to your image-node in the document ... example as follows:

in you html you must have - note the id-attribute there:

[HTML]<img src="imgsrc.jpg " alt="some_alt_d escr" id="whatever_im g_id"/>[/HTML]
now you may get a reference to the node with:

var img_ref = document.getElementById('whatever_img_id');

and this img_ref must be the img_ref in our example above where you get an error. because img_ref has to be declared and assigned the way i showed you here ...

kind regards

[childoflusankya]

I still don't get it. If i put

<img src="imgsrc.jpg " alt="some_alt_d escr" id="whatever_im g_id"/>

in an html page isn't it going to only load "imgsrc.jpg " ?

[acoder]

I still don't get it. If i put

<img src="imgsrc.jpg " alt="some_alt_d escr" id="whatever_im g_id"/>

in an html page isn't it going to only load "imgsrc.jpg " ?

You should use this in addition to the other code. It will load imgsrc.jpg, but the Javascript code will change the src of the image automatically.

[childoflusankya]

Thanks for the reply.

I'm sorry but I'm still not getting it- JS isn't my strong suite, and I have to do a monthly calander thing for work...otherwis e i'd screw with it till i figured it out...

Does the

var img_ref = document.getEle mentById('whate ver_img_id');

line go into the large script above? if so does it have to be placed specifically?

Thanks & Regards

[gits]

hi ...

have a look at the following combined code:

// create actual date
var date = new Date;
 
// img-list ... example
var cal_images = {
    0: 'default.jpg',
    1: 'imgsrc1.jpg',
    2: 'imgsrc2.jpg',
    3: 'imgsrc3.jpg'
};
 
// you need a reference to the image-node ... then set the src
// according to date's month 
 
// this gets the reference to the image with id named 'whatever_img_id'
var img_ref = document.getElementById('whatever_img_id');
 
var month   = date.getMonth() + 1;
img_ref.src = typeof cal_images[month] != 'undefined' ? 
        cal_images[month] : cal_images[0] ;
 

kind regards