4f68a0933c
fixed the resizable text area with IE problem fixed the ad space with IE problem merged the 7.2.0 and 7.1.4 change logs
396 lines
No EOL
8.6 KiB
HTML
396 lines
No EOL
8.6 KiB
HTML
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
|
|
<html>
|
|
<head>
|
|
|
|
<title>Yahoo! Calendar Control - 2-Up Implementation</title>
|
|
|
|
<script type="text/javascript" src="../../../build/yahoo/yahoo.js"></script>
|
|
<script type="text/javascript" src="../../../build/event/event.js" ></script>
|
|
<script type="text/javascript" src="../../../build/dom/dom.js" ></script>
|
|
|
|
<link type="text/css" rel="stylesheet" href="../../../build/fonts/fonts.css">
|
|
<link type="text/css" rel="stylesheet" href="../../../build/reset/reset.css">
|
|
<link rel="stylesheet" type="text/css" href="../../../docs/assets/dpSyntaxHighlighter.css" />
|
|
|
|
<script type="text/javascript" src="../../../build/calendar/calendar.js"></script>
|
|
<link type="text/css" rel="stylesheet" href="../../../build/calendar/assets/calendar.css">
|
|
|
|
<script language="javascript">
|
|
YAHOO.namespace("example.calendar");
|
|
|
|
function init() {
|
|
this.today = new Date();
|
|
|
|
var thisMonth = this.today.getMonth();
|
|
var thisDay = this.today.getDate();
|
|
var thisYear = this.today.getFullYear();
|
|
|
|
this.link1 = document.getElementById('dateLink1');
|
|
this.link2 = document.getElementById('dateLink2');
|
|
|
|
this.selMonth1 = document.getElementById('selMonth1');
|
|
this.selDay1 = document.getElementById('selDay1');
|
|
|
|
this.selMonth1.selectedIndex = thisMonth;
|
|
this.selDay1.selectedIndex = thisDay-1;
|
|
|
|
this.selMonth2 = document.getElementById('selMonth2');
|
|
this.selDay2 = document.getElementById('selDay2');
|
|
|
|
this.selMonth2.selectedIndex = thisMonth;
|
|
this.selDay2.selectedIndex = thisDay-1;
|
|
|
|
YAHOO.example.calendar.cal1 = new YAHOO.widget.Calendar2up("YAHOO.example.calendar.cal1","container1",(thisMonth+1)+"/"+thisYear,(thisMonth+1)+"/"+thisDay+"/"+thisYear);
|
|
YAHOO.example.calendar.cal1.title = "Select your desired departure date:";
|
|
YAHOO.example.calendar.cal1.setChildFunction("onSelect",setDate1);
|
|
YAHOO.example.calendar.cal1.render();
|
|
|
|
YAHOO.example.calendar.cal2 = new YAHOO.widget.Calendar2up("YAHOO.example.calendar.cal2","container2",(thisMonth+1)+"/"+thisYear,(thisMonth+1)+"/"+thisDay+"/"+thisYear);
|
|
YAHOO.example.calendar.cal2.title = "Select your desired return date:";
|
|
YAHOO.example.calendar.cal2.setChildFunction("onSelect",setDate2);
|
|
YAHOO.example.calendar.cal2.render();
|
|
}
|
|
|
|
function showCalendar1() {
|
|
YAHOO.example.calendar.cal2.hide();
|
|
|
|
var pos = YAHOO.util.Dom.getXY(link1);
|
|
YAHOO.example.calendar.cal1.outerContainer.style.display='block';
|
|
YAHOO.util.Dom.setXY(YAHOO.example.calendar.cal1.outerContainer, [pos[0],pos[1]+link1.offsetHeight+1]);
|
|
}
|
|
|
|
function showCalendar2() {
|
|
YAHOO.example.calendar.cal1.hide();
|
|
|
|
var pos = YAHOO.util.Dom.getXY(link2);
|
|
YAHOO.example.calendar.cal2.outerContainer.style.display='block';
|
|
YAHOO.util.Dom.setXY(YAHOO.example.calendar.cal2.outerContainer, [pos[0],pos[1]+link2.offsetHeight+1]);
|
|
}
|
|
|
|
function setDate1() {
|
|
var date1 = YAHOO.example.calendar.cal1.getSelectedDates()[0];
|
|
selMonth1.selectedIndex=date1.getMonth();
|
|
selDay1.selectedIndex=date1.getDate()-1;
|
|
YAHOO.example.calendar.cal1.hide();
|
|
}
|
|
|
|
function setDate2() {
|
|
var date2 = YAHOO.example.calendar.cal2.getSelectedDates()[0];
|
|
selMonth2.selectedIndex=date2.getMonth();
|
|
selDay2.selectedIndex=date2.getDate()-1;
|
|
YAHOO.example.calendar.cal2.hide();
|
|
}
|
|
|
|
function changeDate1() {
|
|
var month = this.selMonth1.selectedIndex;
|
|
var day = this.selDay1.selectedIndex + 1;
|
|
var year = this.today.getFullYear();
|
|
|
|
YAHOO.example.calendar.cal1.select((month+1) + "/" + day + "/" + year);
|
|
YAHOO.example.calendar.cal1.setMonth(month);
|
|
YAHOO.example.calendar.cal1.render();
|
|
}
|
|
|
|
function changeDate2() {
|
|
var month = this.selMonth2.selectedIndex;
|
|
var day = this.selDay2.selectedIndex + 1;
|
|
var year = this.today.getFullYear();
|
|
|
|
YAHOO.example.calendar.cal2.select((month+1) + "/" + day + "/" + year);
|
|
YAHOO.example.calendar.cal2.setMonth(month);
|
|
YAHOO.example.calendar.cal2.render();
|
|
}
|
|
|
|
YAHOO.util.Event.addListener(window, "load", init);
|
|
</script>
|
|
|
|
</head>
|
|
|
|
<body style="margin:0px">
|
|
|
|
<img src="img/ytravel.gif" id="bgImg">
|
|
|
|
<div style="position:absolute;left:148px;top:275px">
|
|
<select id="selMonth1" name="selMonth1" onchange="changeDate1()" style="vertical-align:middle">
|
|
<option value="Jan">
|
|
Jan
|
|
</option>
|
|
<option value="Feb">
|
|
Feb
|
|
</option>
|
|
<option value="Mar">
|
|
Mar
|
|
</option>
|
|
<option value="Apr">
|
|
Apr
|
|
</option>
|
|
<option value="May">
|
|
May
|
|
</option>
|
|
<option value="Jun">
|
|
Jun
|
|
</option>
|
|
<option value="Jul">
|
|
Jul
|
|
</option>
|
|
<option value="Aug">
|
|
Aug
|
|
</option>
|
|
<option value="Sep">
|
|
Sep
|
|
</option>
|
|
<option value="Oct">
|
|
Oct
|
|
</option>
|
|
<option value="Nov">
|
|
Nov
|
|
</option>
|
|
<option value="Dec">
|
|
Dec
|
|
</option>
|
|
</select>
|
|
<select name="selDay1" id="selDay1" onchange="changeDate1()" style="vertical-align:middle">
|
|
<option value="1">
|
|
1
|
|
</option>
|
|
<option value="2">
|
|
2
|
|
</option>
|
|
<option value="3">
|
|
3
|
|
</option>
|
|
<option value="4">
|
|
4
|
|
</option>
|
|
<option value="5">
|
|
5
|
|
</option>
|
|
<option value="6">
|
|
6
|
|
</option>
|
|
<option value="7">
|
|
7
|
|
</option>
|
|
<option value="8">
|
|
8
|
|
</option>
|
|
<option value="9">
|
|
9
|
|
</option>
|
|
<option value="10">
|
|
10
|
|
</option>
|
|
<option value="11">
|
|
11
|
|
</option>
|
|
<option value="12">
|
|
12
|
|
</option>
|
|
<option value="13">
|
|
13
|
|
</option>
|
|
<option value="14">
|
|
14
|
|
</option>
|
|
<option value="15">
|
|
15
|
|
</option>
|
|
<option value="16">
|
|
16
|
|
</option>
|
|
<option value="17">
|
|
17
|
|
</option>
|
|
<option value="18">
|
|
18
|
|
</option>
|
|
<option value="19">
|
|
19
|
|
</option>
|
|
<option value="20">
|
|
20
|
|
</option>
|
|
<option value="21">
|
|
21
|
|
</option>
|
|
<option value="22">
|
|
22
|
|
</option>
|
|
<option value="23">
|
|
23
|
|
</option>
|
|
<option value="24">
|
|
24
|
|
</option>
|
|
<option value="25">
|
|
25
|
|
</option>
|
|
<option value="26">
|
|
26
|
|
</option>
|
|
<option value="27">
|
|
27
|
|
</option>
|
|
<option value="28">
|
|
28
|
|
</option>
|
|
<option value="29">
|
|
29
|
|
</option>
|
|
<option value="30">
|
|
30
|
|
</option>
|
|
<option value="31">
|
|
31
|
|
</option>
|
|
</select><a href="javascript:void(null)" onclick="showCalendar1()"><img id="dateLink1" src="../img/pdate.gif" border="0" style="vertical-align:middle;margin:5px"/></a>
|
|
</div>
|
|
|
|
|
|
<div style="position:absolute;left:303px;top:275px">
|
|
<select id="selMonth2" name="selMonth2" onchange="changeDate2()" style="vertical-align:middle">
|
|
<option value="Jan">
|
|
Jan
|
|
</option>
|
|
<option value="Feb">
|
|
Feb
|
|
</option>
|
|
<option value="Mar">
|
|
Mar
|
|
</option>
|
|
<option value="Apr">
|
|
Apr
|
|
</option>
|
|
<option value="May">
|
|
May
|
|
</option>
|
|
<option value="Jun">
|
|
Jun
|
|
</option>
|
|
<option value="Jul">
|
|
Jul
|
|
</option>
|
|
<option value="Aug">
|
|
Aug
|
|
</option>
|
|
<option value="Sep">
|
|
Sep
|
|
</option>
|
|
<option value="Oct">
|
|
Oct
|
|
</option>
|
|
<option value="Nov">
|
|
Nov
|
|
</option>
|
|
<option value="Dec">
|
|
Dec
|
|
</option>
|
|
</select>
|
|
<select name="selDay2" id="selDay2" onchange="changeDate2()" style="vertical-align:middle">
|
|
<option value="1">
|
|
1
|
|
</option>
|
|
<option value="2">
|
|
2
|
|
</option>
|
|
<option value="3">
|
|
3
|
|
</option>
|
|
<option value="4">
|
|
4
|
|
</option>
|
|
<option value="5">
|
|
5
|
|
</option>
|
|
<option value="6">
|
|
6
|
|
</option>
|
|
<option value="7">
|
|
7
|
|
</option>
|
|
<option value="8">
|
|
8
|
|
</option>
|
|
<option value="9">
|
|
9
|
|
</option>
|
|
<option value="10">
|
|
10
|
|
</option>
|
|
<option value="11">
|
|
11
|
|
</option>
|
|
<option value="12">
|
|
12
|
|
</option>
|
|
<option value="13">
|
|
13
|
|
</option>
|
|
<option value="14">
|
|
14
|
|
</option>
|
|
<option value="15">
|
|
15
|
|
</option>
|
|
<option value="16">
|
|
16
|
|
</option>
|
|
<option value="17">
|
|
17
|
|
</option>
|
|
<option value="18">
|
|
18
|
|
</option>
|
|
<option value="19">
|
|
19
|
|
</option>
|
|
<option value="20">
|
|
20
|
|
</option>
|
|
<option value="21">
|
|
21
|
|
</option>
|
|
<option value="22">
|
|
22
|
|
</option>
|
|
<option value="23">
|
|
23
|
|
</option>
|
|
<option value="24">
|
|
24
|
|
</option>
|
|
<option value="25">
|
|
25
|
|
</option>
|
|
<option value="26">
|
|
26
|
|
</option>
|
|
<option value="27">
|
|
27
|
|
</option>
|
|
<option value="28">
|
|
28
|
|
</option>
|
|
<option value="29">
|
|
29
|
|
</option>
|
|
<option value="30">
|
|
30
|
|
</option>
|
|
<option value="31">
|
|
31
|
|
</option>
|
|
</select><a href="javascript:void(null)" onclick="showCalendar2()"><img id="dateLink2" src="../img/pdate.gif" border="0" style="vertical-align:middle;margin:5px"/></a>
|
|
</div>
|
|
|
|
|
|
<div id="container1" style="position:absolute;display:none"></div>
|
|
<div id="container2" style="position:absolute;display:none"></div>
|
|
|
|
<script src="../../../docs/assets/dpSyntaxHighlighter.js"></script>
|
|
<script language="javascript">
|
|
dp.SyntaxHighlighter.HighlightAll('code');
|
|
</script>
|
|
|
|
</body>
|
|
</html> |