JavaScript - Display Image By Date - Countdown Images

Hello im using this code to display a countdowntimer

Code:

<script type="text/javascript">
            var timecd;
            timecd = document.getElementById('<%= Text1.ClientID %>').value;
            var GAME = ' | Hells Gate |';
            var OpenTimeCOUNTER = '';
            var TargetCOUNTER = document.getElementById('COUNTER');
            var SecondsCOUNTER = timecd;
            var TargetTimeCOUNTER = new Date();
            var TimeBeginnCOUNTER = TargetTimeCOUNTER.getTime();
            var TimeEndCOUNTER = TimeBeginnCOUNTER + (SecondsCOUNTER * 1000);
            TargetTimeCOUNTER.setTime(TimeEndCOUNTER);
            var DayCOUNTER = TargetTimeCOUNTER.getDate();
            var MonthCOUNTER = TargetTimeCOUNTER.getMonth() + 1;
            var YearCOUNTER = TargetTimeCOUNTER.getYear();
            if (YearCOUNTER < 999) YearCOUNTER += 1900;
            var hCOUNTER = TargetTimeCOUNTER.getHours();
            var mCOUNTER = TargetTimeCOUNTER.getMinutes();
            var sCOUNTER = TargetTimeCOUNTER.getSeconds();
            var fdayCOUNTER = ((DayCOUNTER < 10) ? "0" : "");
            var fmonthCOUNTER = ((MonthCOUNTER < 10) ? ".0" : ".");
            var fhCOUNTER = ((hCOUNTER < 10) ? "0" : "");
            var fmCOUNTER = ((mCOUNTER < 10) ? ":0" : ":");
            var fsCOUNTER = ((sCOUNTER < 10) ? ":0" : ":");
            var EndDateCOUNTER = fdayCOUNTER + DayCOUNTER + fmonthCOUNTER + MonthCOUNTER + "." + YearCOUNTER;
            var EndTimeCOUNTER = fhCOUNTER + hCOUNTER + fmCOUNTER + mCOUNTER + fsCOUNTER + sCOUNTER;
            var counterthing = window.setTimeout("CountDownCOUNTER()", 1000);

            function CountDownCOUNTER() {
                var CurrentDateCOUNTER = new Date();
                var CurrentTimeCOUNTER = CurrentDateCOUNTER.getTime();
                OpenTimeCOUNTER = Math.floor((TargetTimeCOUNTER - CurrentTimeCOUNTER) / 1000);
                var sCOUNTER = OpenTimeCOUNTER % 60;
                var mCOUNTER = ((OpenTimeCOUNTER - sCOUNTER) / 60) % 60;
                var hCOUNTER = ((OpenTimeCOUNTER - sCOUNTER - mCOUNTER * 60) / (60 * 60));
                var fhCOUNTER = ((hCOUNTER < 10) ? "0" : "");
                var fmCOUNTER = ((mCOUNTER < 10) ? ":0" : ":");
                var fsCOUNTER = ((sCOUNTER < 10) ? ":0" : ":");
                var TimeCOUNTER = fhCOUNTER + hCOUNTER + fmCOUNTER + mCOUNTER + fsCOUNTER + sCOUNTER;
                var OutputStringCOUNTER = TimeCOUNTER;

                if (OpenTimeCOUNTER <= 0) {
                    OutputStringCOUNTER = '<a href="Default.aspx">Refresh<\/a>';
                    window.clearTimeout(counterthing);
                }
                TargetCOUNTER.innerHTML = OutputStringCOUNTER;
                document.title = (OutputStringCOUNTER.substring(0, 2) == "<a") ? "!!!READY!!!" : OutputStringCOUNTER + GAME;
                counterthing = window.setTimeout("CountDownCOUNTER()", 1000);
            }
</script>

When im debuging the project it shows ok without any problems:

But when i host the website on the server i Get a NaN:NaN:NaN

Don't know what is hapening... any help would be great

Thanks Ricardo

Hi all, I'm making a combo box, and I want it defaulted to todays date. What am I doing wrong?

in the body onload function I call time_Stamp()

In time_Stamp I'm doing

Code:

document.getElementById('job_month').value="test";

My combo box looks like this:

Code:

<select ID="job_month" value="" tabindex="11">
<option selected value=""><script>nowTime</script></option>
<option value="01">Jan</option>
<option value="02">Feb</option>
<option value="03">Mar</option>
<option value="04">Apr</option>
<option value="05">May</option>
<option value="06">Jun</option>
<option value="07">Jul</option>
<option value="08">Aug</option>
<option value="09">Sep</option>
<option value="10">Oct</option>
<option value="11">Nov</option>
<option value="12">Dec</option>
</select>

I'm trying all different options and can't figure out how to have the month auto checked to current month. Any help please?

I'm wanting to put a piece of code on my website that will display when our next meeting will be. We have 2 meetings per month. I'm thinking what I need to do is create a code that gets the current month, day of month, and year then combines it together somehow, and if that combination is in a certain range a particular statement, "Next meeting is MM, DD YY." or "Next meeting is today." is displayed.

If date is equal to or between 01012012 and 01112012, "Next meeting is January, 12 2012" is displayed.
If date is equal to 01122012, "Next meeting is today" is displayed.
If date is equal to or between 01132012 and 01252012, "Next meeting is January, 26 2012" is displayed.
If date is equal to 01262012, "Next meeting is today" is displayed.
...that kind of thing.

How would I combine the month, day of month, and year?
Would 48 if statements be what I need to do?

Sorry, I'm pretty new to javascript. If there's a better way to do this, please let me know.

Thanks,

CJ

So I want this function to return the date in the format: 4-Jan-2011. I feel like I have to make the variables strings or something but I can't figure it out, I'm kinda new to javascript.

Code:

function calander(TheDay) {
                var theDate = new Date();
                var day = new theDate.getDay();
                var month = new theDate.getMonth();
                var year = new theDate.getFullYear();
                
                if (month == 0) {month = "Jan";}if (month == 1) { month = "Feb"; }
                if (month == 2) { month = "March"; }if (month == 3) { month = "April"; }
                if (month == 4) { month = "May"; }if (month == 5) { month = "June"; }
                if (month == 6) { month = "July"; }if (month == 7) { month = "Aug"; }
                if (month == 8) { month = "Sept"; }if (month == 9) { month = "Oct"; }
                if (month == 10) { month = "Nov"; }if (month == 11) { month = "Dec"; }

                TheDay.value = day + "-" + month + "-" + year;
}

Hello,
I've been trying to figure this script out for awhile and I've hit a wall. Basically, what I want to do for my organization's website is to use JS to display an image containing our hours and have it change each day of the week.

The hard part (for me) is that there are certain days we're closed. Ideally, I'd like a separate "We're Closed" message to overwrite the image carrying our hours on specific days (major holidays like Xmas, New Years, Vet's Day, furlough periods, etc. etc.).

Here's the code I've managed to cobble together (I have a real basic understanding of JS, so I've been pulling scripts from sites offering free copy/pastecode):

[CODE]
<script language="javascript">

mytime=new Date();
mymonth=mytime.getMonth()+1;
mydate=mytime.getDate();
myday=mytime.getDay();
arday = new Array("sunday.png", "monday.png", "tuesday.png",
"wednesday.png", "thursday.png", "friday.png", "saturday.png");

document.write("<img src='" + arday[myday] + "'>");
if (mymonth==12 && mydate==24){document.write("<img src='closure.png'>");
}

</script>
[CODE]

For the most part, this code works just fine. However, if I jump my system clock to December 24, the "closure.png" comes up appears ALONGSIDE the hours image for that day of the week. In other words, I've got two images appearing right next to each other - that's not what I want.

How can I work the code in such a way that when a closure date comes up (in this case, 12/24), just the "closure.png" image shows up by itself?

Thank you all so much for your time and patience.

Hello, have a website that contains many excel files (.xls and .zip). I need to display the last modified date of these files. They currently reside on a webserver. I found this script in this forum, BUT, it only seems to work for .htm or really anything else except .xls or .zip files.

<html>
<head>
<title>Last Modified</title>
<script type="text/javascript">
function getLastMod(){
var myFrm = document.getElementById('myIframe');
var lastModif = new Date(myFrm.contentWindow.document.lastModified);
document.getElementById('LastModified').innerHTML = "Last Update: " + lastModif.toLocaleString();
}
</script>

</head>
<body>
<span id="LastModified"></span>

<iframe id="myIframe" onload="getLastMod()" src="DFC_new_page.htm" style="display:none;" width="352" height="137">
</iframe>


</body>
</html>

Also, when I place an .xls file inside the src= field it ends up opening the file.

HELP!!!! I am new to writing scripts and unfortunately only have Frontpage to use for this. Thank you!!!!!

I'm trying to find a way to display a future date in short format (as an expiration date) with Javascript. I've figured out how to do it with long format, but have no idea how to convert it and I'm not great with Javascript.

Here is code that I found on another forum and modified:

Code:

<!doctype html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
</head>

<body>


<!doctype html>
<head>
<title>Expires</title>
</head>
<body>

<script>

var myDelayInDays=6, myDate=new Date();
myDate.setDate(myDate.getDate()+myDelayInDays);

document.write('Expires: ' + myDate.toLocaleDateString());

</script>
</body>
</html>

</body>
</html>

Which displays:

"Expires: Monday, May 21, 2012"

I would like it to display:

"Expires: 05/21/2012"

Can anyone help?!

howdy,

my site is www.site-tonight.com and on the homepage i have a jcarouselLite that came with the wordpress template that im using. I cannot get it to display more then 3 images, even if i put another <li> item in there.

I've copied and pasted the last image 2-3 times over and it won't display. I've also tried changing it to a new image and putting it at the end and it still won't display.

I have scoured the internet and spent a lot of time trying to figure this out and it's stumping me, so help is muchhhhhh appreciated.

any suggestions for a newbie?

Hello;

New to Javascripting, new to forum. I searched the forum, and tried to adapt, to no avail.

I am building a store and want users to be able to see how two items look together. I have it working, but it uses a drop down.

I would like to display many items and have the user click on one "image", from the display of "top" images, to display it on top, and from another section of "bottom" images, click another image to display it on bottom.

For instance to see what one plant would look like in different vases.


If I could be picky, is there a way to make it all happen in the BODY of the page? I use DW and a template.

Code:

<html>
<head>

<script language="javascript">

function showimage()
{
if (!document.images)
return
document.images.pictures.src=
document.mygallery.picture.options[document.mygallery.picture.selectedIndex].value
document.images.pictures2.src=
document.mygallery2.picture2.options[document.mygallery2.picture2.selectedIndex].value
}
//-->
</script>

</head>

<body>
<p class="style1">Try a few selections for your gift.</p>
<table border="0" align="center" cellpadding="0" cellspacing="0"> 
<tr> 
<td><form name="mygallery"><select 
name="picture" size="1" onChange="showimage()"> 
<option selected value="images/bear1.jpg">Bear 1</option> 
<option value="images/bear2.jpg">Bear 2</option> 
<option value="images/plant1.jpg">Plant 1</option> 
<option value="images/plant2.jpg">Plant 2</option> 
<option value="images/plant3.jpg">Plant 3</option> 
</select> 
</form> 
</td> 
 
<td><a href="javascript:linkrotate(document.mygallery.picture.selectedIndex)" onMouseover="window.status='';return true"><img src="images/bear1.jpg" name="pictures" width="150" border=0></a></td> 
</tr> 
 
<tr> 
<td><form name="mygallery2"><select 
name="picture2" size="1" onChange="showimage()"> 
<option selected value="images/cup1.jpg">Mug 1</option> 
<option value="images/cup2.jpg">Mug 2</option> 
</select> 
</form> 
</td> 
 
 
<td><a href="javascript:linkrotate(document.mygallery2.picture2.selectedIndex)" onMouseover="window.status='';return true"><img src="images/cup1.jpg" name="pictures2" width="150" border=0></a></td> 
</tr> 
 
</table>
</body>
</html>

Hi there,

I found this thread on the forum its from a few years back but the code works, but I can't seem to get the image that appears as you rollover the button to display in the correct place. I'm not sure if its because I'm using tables within tables? Should I recode in divs?

Any help is greatly appreciated!!

http://www.codingforums.com/archive/...p/t-95847.html

www.e-decals.com/dev displays fine in Firefox and Safari, (link color a {
color : #b2b2b2 correct) but IE showing default link colors around images in multibox - IE error he

User Agent: Mozilla/4.0 (compatible; MSIE 8.0; Windows NT 6.0; Trident/4.0; GTB6; SLCC1; .NET CLR 2.0.50727; .NET CLR 1.1.4322; .NET CLR 3.5.30729; .NET CLR 3.0.30618)
Timestamp: Thu, 5 Nov 2009 15:11:40 UTC

Message: Object doesn't support this property or method
Line: 467
Char: 4
Code: 0
URI: http://www.e-decals.com/dev/multibox/multibox.js

Any ideas?

hi,

i am currently doing a program that will display the image continuously. the image name will be like pic1.jpg , pic2.jpg , pig3.jpg untill pic10.jpg

this is my code so far :

<html>
<head>
<script type="text/JavaScript">
var fileName;

function display()
{
fileName = new Array();
for( i=0; i<5; i++)
{
fileName[i] = new Image();
fileName[i].src = "screenshot_" + i + ".jpeg";
}
}
display();

</script>
</head>
<body>
</body>
</html>


but when i run it, it give me infinity loop, can anyone tell me what is the problem of that ? thanks in advance for the reply

Hi people,

I'm building an online psychological experiment in which I need to display an image for 5 seconds on the screen.

Does anyone has a simple script for that?

I found some script that does image rotation but its not exactly what I am looking for. First, the rotation of the images doesn't stop and second I don't need something so elaborate.

This is the script that I found.

Code:

<SCRIPT LANGUAGE="JavaScript">
<!--
var dimages=new Array();
var numImages=2;
for (i=0; i<numImages; i++)
{
  dimages[i]=new Image();
  dimages[i].src="images/image"+(i+1)+".jpg";
}
var curImage=-1;
function swapPicture()
{
  if (document.images)
  {
    var nextImage=curImage+1;
    if (nextImage>=numImages)
      nextImage=0;
    if (dimages[nextImage] && dimages[nextImage].complete)
    {
      var rel="nofollow" target=0;
      if (document.images.myImage)
        rel="nofollow" target=document.images.myImage;
      if (document.all && document.getElementById("myImage"))
        rel="nofollow" target=document.getElementById("myImage");
  
      // make sure target is valid.  It might not be valid
      //   if the page has not finished loading
      if (target)
      {
        target.src=dimages[nextImage].src;
        curImage=nextImage;
      }
      setTimeout("swapPicture()", 5000);
    }
    else
    {
      setTimeout("swapPicture()", 500);
    }
  }
}
setTimeout("swapPicture()", 5000);
//-->
</SCRIPT>

Thanks

trying to display an image using an img tag
which uses the array value as the image path



here is where i set up the array called " img_path " in the head

<script type="text/javascript">
var img_path = [
'images/west/Home.png',
'images/west/Cold.png',
'images/west/Ocean.png',
'images/west/Beach.png'
];
</script>


later, in the body, i'm trying to use the array value to splash the image on the web page, like this

<img src=" img_path[0] " width="250" height="250">


the result splashes a 250x250 image area on the webpage but not the image (?). why not the image ?



i tested the value of "img_path[0]" and it prints out correctly as 'images/west/Home.png'



i even cut/pasted this code in and the image splashed out just fine.
<img src=" images/west/Home.png " width="250" height="250">



not sure why this won't work?
anyone have any suggestions?

thanks,
Paul

weather in Kalispell, MT this morning........not to bad, about 28deg.
Merry Christmas and Happy New Year to all.