Calendario Mi problema es que quiero poner un calendario en una web pero no sé cómo insertar el código del calendario en el código de la web. Alguien me puede ayudar?
Codigo Web
<f!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<HTML>
<HEAD>
<TITLE></TITLE>
<meta http-equiv="Content-Style-Type" content="text/css">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<LINK HREF="style.css" TYPE="text/css" REL="stylesheet">
</HEAD>
<BODY>
<table cellspacing="0" cellpadding="0" align="center">
<tr>
<td style="width:766px; height:780px">
<table cellspacing="0" cellpadding="0">
<tr>
<td style="width:42px; height:780px"></td>
<td style="width:676px; height:780px">
<table cellspacing="0" cellpadding="0">
<tr>
<td style="width:676px; height:119px; background-image: url(images/grey_bg.gif); background-repeat:no-repeat">
<table cellspacing="0" cellpadding="0">
<tr>
<td style="width:560px; height:119px">
<br style="line-height:48px">
<img src="images/c_name.gif" alt="" hspace="3">
</td>
<td style="width:116px; height:119px">
<br style="line-height:66px">
<a href="index-1.html"><img src="images/link.gif" alt="" style="margin-right:18px" border="0"></a><a href="#"><img src="images/link1.gif" alt="" style="margin-right:21px" border="0"></a><a href="#"><img src="images/link2.gif" alt="" border="0"></a> </td>
</tr>
</table>
</td>
</tr>
<tr>
<td style="width:676px; height:563px">
<table cellspacing="0" cellpadding="0">
<tr>
<td style="width:226px; height:563px">
<a href="index.html"><img src="images/back.gif" alt="" border="0"></a><img src="images/pic1_1.gif" alt=""><br>
<img src="images/pic1_2.gif" alt=""><br>
<a href="index-2.html"><img src="images/comp.gif" alt="" border="0"></a><a href="index-3.html"><img src="images/srv.gif" alt="" border="0"></a><br>
<a href="index-4.html"><img src="images/sol.gif" alt="" border="0"></a><a href="index-5.html"><img src="images/cont.gif" alt="" border="0"></a><br> </td>
<td style="width:450px; height:563px; background-color:#F8F8F8; background-image:url(images/top.gif); background-repeat:no-repeat">
<table cellspacing="0" cellpadding="0">
<tr>
<td style="width:450px; height:563px; background-image:url(images/bottom.gif); background-repeat:no-repeat; background-position: left bottom">
<br style="line-height:31px">
<img src="images/title7.gif" alt="" style="margin-left:29px"><br>
<div style="margin-left:30px">
<br style="line-height:8px">
Lorem ipsum dolor sit amet, consec tetuer adipiscing elit. Praesent vestibulum<br>
molestie lacus. Aenean nonummy hendrerit mauris. Phasellus porta. Fusce sus- <br>
cipit varius mi. Cum sociis natoque penatibus et.<br>
<br>
</div></td>
</tr>
</table>
</td>
</tr>
</table>
</td>
</tr>
<tr>
<td style="width:676px; height:98px" class="policy">
<br style="line-height:45px">
YourCompany.Com © 2006 <img src="images/img.gif" alt=""> <a href="index-6.html">Privacy Policy</a> </td>
</tr>
</table>
</td>
<td style="width:48px; height:780px"></td>
</tr>
</table>
</td>
</tr>
</table>
</BODY>
</HTML>
Codigo del calendario
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>jsDatePick javascript example</title>
<!--
Copyright 2010 Itamar Arjuan
jsDatePick is distributed under the terms of the GNU General Public License.
************************************************** **************************************
Copy paste these 2 lines of code to every page you want the calendar to be available at
-->
<link rel="stylesheet" type="text/css" media="all" href="jsDatePick_ltr.min.css" />
<!--
OR if you want to use the calendar in a right-to-left website
just use the other CSS file instead and don't forget to switch g_jsDatePickDirectionality variable to "rtl"!
<link rel="stylesheet" type="text/css" media="all" href="jsDatePick_ltr.css" />
-->
<script type="text/javascript" src="jsDatePick.min.1.3.js"></script>
<!--
After you copied those 2 lines of code , make sure you take also the files into the same folder
Next step will be to set the appropriate statement to "start-up" the calendar on the needed HTML element.
This example is of the direct HTML appending calendar version which can be used
in two ways. with a stripped mode or without.
BUT - in both cases , it simply attaches to an HTML element and stays there.
When used in this way , you will have to make a javascript function that will be registered
as an event handler of the clicking action on each day.
This is done easily like shown in the example.
-->
<script type="text/javascript">
window.onload = function(){
g_globalObject = new JsDatePick({
useMode:1,
isStripped:true,
target:"div3_example"
/*selectedDate:{ This is an example of what the full configuration offers.
day:5, For full documentation about these settings please see the full version of the code.
month:9,
year:2006
},
yearsRange:[1978,2020],
limitToToday:false,
cellColorScheme:"beige",
dateFormat:"%m-%d-%Y",
imgPath:"img/",
weekStartDay:1*/
});
g_globalObject.setOnSelectedDelegate(function(){
var obj = g_globalObject.getSelectedDay();
alert("a date was just selected and the date is : " + obj.day + "/" + obj.month + "/" + obj.year);
document.getElementById("div3_example_result").inn erHTML = obj.day + "/" + obj.month + "/" + obj.year;
});
g_globalObject2 = new JsDatePick({
useMode:1,
isStripped:false,
target:"div4_example",
cellColorScheme:"beige"
/*selectedDate:{ This is an example of what the full configuration offers.
day:5, For full documentation about these settings please see the full version of the code.
month:9,
year:2006
},
yearsRange:[1978,2020],
limitToToday:false,
dateFormat:"%m-%d-%Y",
imgPath:"img/",
weekStartDay:1*/
});
g_globalObject2.setOnSelectedDelegate(function(){
var obj = g_globalObject2.getSelectedDay();
alert("a date was just selected and the date is : " + obj.day + "/" + obj.month + "/" + obj.year);
document.getElementById("div3_example_result").inn erHTML = obj.day + "/" + obj.month + "/" + obj.year;
});
};
</script>
</head>
<body>
<h2><br />
</h2>
<div id="div3_example" style="margin:10px 0 30px 0; border:dashed 1px red; width:205px; height:230px;">
</body>
</html>
