Photo of The Day Script for use in a .html file from a Database?

bryskyd
bryskyd used Ask the Experts™
on
I'm looking to find something that can be used on an html page, either by virtual include or in-page code that could refrence a photo of the day either by date alon - photos named like such: "02_1120.jpg" or from a database that could have 365 Entries, one for each day of the year, where I could enter the file names, and have them swapped out for a variable called on the page.

Please help!

Thanks,
Bryskyd
Comment
Watch Question

Do more with

Expert Office
EXPERT OFFICE® is a registered trademark of EXPERTS EXCHANGE®

Commented:
Just copy & paste from that line:

<HTML>
<HEAD>
<META NAME="GENERATOR" Content="Microsoft Visual Studio 6.0">
<TITLE></TITLE>
<SCRIPT LANGUAGE=javascript>
<!--

function getPicName(){
     var dt;
     var mm;
     dt = new Date()
     mm =dt.getMonth() + 1;
     //rslt = dt.getFullYear().toString();
     alert(dt.getFullYear().toString() + '_' + mm.toString() + dt.getDate().toString() + '.jpg');
}
//-->
</SCRIPT>

</HEAD>
<BODY>

<P>&nbsp;</P>
<input type="button" value="Click me" onclick="javascript:getPicName();")>

</BODY>
</HTML>



HTH,
Gal.
Top Expert 2013

Commented:
<html>
<head>
<title> date pic</title>
<script language="JavaScript>
<!--
function setImage()
{
   var thedate=new Date();
   var mon=thedate.getMonth;
   mon++;
   var str=thedate.getYear()+"_"+mon+thedate.getDate()+".jpg";
   document.images['theimg'].src=str;
}
onload=setImage;
//-->
</script>
</head>
<body>
<img src="" name="theimg">
</body>
</html>

Author

Commented:
This looks good, but COBOLdinosaur, where would i add the /dir/dir/images.jpg if the images are not in the same folder?
Ensure you’re charging the right price for your IT

Do you wonder if your IT business is truly profitable or if you should raise your prices? Learn how to calculate your overhead burden using our free interactive tool and use it to determine the right price for your IT services. Start calculating Now!

Top Expert 2013

Commented:
The path goes right at the start of the string:

var str="dir/dir/"+thedate.getYear()+"_"+mon+thedate.getDate()+".jpg";


Cd&

Author

Commented:
This looks good, but COBOLdinosaur, where would i add the /dir/dir/images.jpg if the images are not in the same folder?

Commented:
In what folder are they ?

Author

Commented:
COBOLdinosaur, it doesn't seem to be working, here's the page where I'm trying to use it:

http://www.bexperiment.com/potd_new.html

Thanks in advance!
Top Expert 2013
Commented:
OH!  My bad....  I left out a closing quote on JAvaScript", and left the parenthesis off get month.  Here is the corrected version.  This should set the image to /_gfx/potd/2001_1121.jpg

     <script language="JavaScript">
<!--
function setImage()
{
  var thedate=new Date();
  var mon=thedate.getMonth();
  mon++;
  var str="/_gfx/potd/"+thedate.getYear()+"_"+mon+thedate.getDate()+".jpg";
  document.images['potdfull'].src=str;
}
onload=setImage;
//-->
</script>


Cd&

Author

Commented:
Interesting, now it pulls the following image:

http://www.bexperiment.com/_gfx/potd/2002_NaN21.jpg

Instead of the correct:
http://www.bexperiment.com/_gfx/potd/02_1121.jpg

If I need to rename all of the images to use 2002 I will, however the month and day still do not pull correctly.

Any Ideas?

Author

Commented:
Nevermind.. sometimes I get so dense. I didnt read your previous message all the way through. I only corrected the "javascript" not get month.

Thanks!

<Question Solved!>

Author

Commented:
Followed up, EXCLENT!
Top Expert 2013

Commented:
Glad I could finally get it right.  Thanks for the A. :^)

Cd&

Author

Commented:
No problem.. looks like your the top dog around here!

One last question: do you have any idea why it breifly shows a "image not found" red X before it loads the image? (http://www.bexperiment.com/potd.html)

Now I got to post a follow up question to see how I can get a Drop Down menu with all of the previous Photos of the Day.

Soon those links on the left hand side just wont cut it! :)

Author

Commented:
Oh no, I'm out of points.. how does a newbie get more points around here? :)
Top Expert 2013

Commented:
The red x is because the browser it putting a placeholder for the image.  It does not generate teh name of the source until after the page is loaded.  You can get around it by creating a small transparent image and name it blank.gif then change the tag like this:
<img src="blank.gif" name="theimg">
now it will load in the blank gif during the initial rendering and the the script will replace the source of the image.

For the drop down menu, you might find what you need here:
www.dynamicdrive.com
They have quite a few pre-written scripts and most of them are easy to customize.

As for points:
http://www.experts-exchange.com/Web/Web_Languages/HTML/memberEarnPoints.jsp

Cd&

Do more with

Expert Office
Submit tech questions to Ask the Experts™ at any time to receive solutions, advice, and new ideas from leading industry professionals.

Start 7-Day Free Trial