forms - javascript, how to implement an index page function to execute a seperate page of .js functions -
i've created 2 functions perform these tasks:
function displaybanner(currentdate) { /* month current date */ /* set imgsource variable defaultlogo image */ /* if month 12, 1, or 2, set variable imgsource winterlogo or defaultlogo if not 1 of 3 months */ /* if month 3, 4, or 5, set imgsource springlogo or defaultlogo if not 1 of 3 months */ /* if month 6, 7, or 8, set imgsource summerlogo or defaultlogo if not 1 of 3 months */ /* if month 10, 11, or 12, set imgsource falllogo or defaultlogo if not 1 of 3 months */ /* return imagesource variable set mybanner imgsrc attribute image*/ } function calcdaystosale(currentdate) { /* create date object 15th of current month */ /* compute difference in days between currentdate , 15th */ /* if difference positive return value else return message sale on month */ }
however! i'm meant create third function can reside in header of index page can subsequently execute functions , therein lies problem- can't figure out.
i've check work using 'alert();' function , shows operation of 2 i've created sound can't pin down how act speak.
the page looks this:
<script type="text/javascript" src="flowers.js"></script> <script type="text/javascript"> var curdate = new date() alert(curdate); function displaybanner(currenttdate) { var munf = currenttdate.getmonth(); switch (munf) { case 9: case 8: case 10: imagesrc = 'falllogo.gif'; break; case 11: case 0: case 1: imagesrc = 'winterlogo.gif'; break; case 2: case 3: case 4: imagesrc = 'springlogo.gif'; break; case 7: case 5: case 6: imagesrc = 'summerlogo.gif'; break; default: imagesrc = 'defaultlogo.gif'; } return imagesrc; } function calcdaystosale(currentdate) { var salemessage; var mday = currentdate.getdate() if (currentdate < 15) { var lef = (15 - currentdate); //alert("there " + lef + " days until sale."); salemessage = lef; } else if (currentdate == 15) { //alert("the sale today!"); salemessage = "zero, it's today!"; } else { //alert("the sale month has ended."); salemessage = "the sale month has ended."; } return salemessage; } alert(calcdaystosale(curdate)); alert(displaybanner(curdate)); function pagesetup() { } </script> </head> <body class="onecolliqctrhdr"> <div id="container"> <div id="header"> <p><img name="mybanner" id="mybanner" src="" alt="carol's flowers" /> <!-- end #header --> </p> <div id="links"><a href="#">home</a> | <a href="#">general arrangements</a> | <a href="#">seasonal designs</a> | <a href="#">custom orders</a> | <a href="#">location</a></div> </div> <div id="maincontent"> <table id="maintable"> <tr> <td width="201"><h1><img src="flowers.jpg" alt="random flowers" width="200" height="255" /></h1></td> <td width="687"> <p>here @ carol's flowers, believe there perfect floral arrangment every occasion! take around , see if there like. if don't have it, create you!</p></td> </tr> </table> <!-- end #maincontent --></div> <div id="footer"> <p> <form name="sale" id="sale"> days until mid month madness sale : <input type="text" name="salemessage" id="salemessage" /></form></p> <!-- end #footer --></div> <!-- end #container --></div> </body> </html>
but said i'm meant cut first 2 functions out, throw them seperate 'flowers.js' page , run pagesetup() function.
the goal of 2 functions set image source banner on 1 hand , on other display in bottom form number of days left until 'sale' takes place on 15th of month, or if 15th has passed, let user know info.
although question not clear. let me take shot @ it. so, moved 2 functions new js file "flowers.js". included flowers.js on page , tried calling 2 functions pagesetup method exists on page. tried? did not work?
if not, need make sure "flowers.js" has finished loading before can call it's functions. 1 way check if causing issue change code call pagesetup after page has finished loading.
<body onload="pagesetup();">
let me know if problem different. :)
edit:
setting image source in run-time using javascript, can following..
<img id="my_image_id" src="flowers.jpg" alt="random flowers" width="200" height="255" /> <script type="text/javascript"> function changeimage(a) { document.getelementbyid("my_image_id").src=displaybanner(10); } </script>
ps:
rename displaybanner get_image_source or something..
Comments
Post a Comment