0
私は以下のコードで作業ポップアップを持っています。私はこれをstunning smooth pop up using jqueryで見つけたこの「シンプルな」チュートリアルに変換したいと思っていましたが、私はこれに苦労しました。jQueryポップアップと苦労して
ここではPHPスクリプトによってによって生成されたHTMLです：
<!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>
<title>Web Calendar</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link rel="shortcut icon" href="lcal.ico" />
<link rel="stylesheet" type="text/css" href="css/css.php" />
<script type="text/javascript">
var dFormat = 1;
var dSepar = ".";
var time24 = 1;
var wStart = 1;
var dpToday = "today";
var dpClose = "close";
var dpMonths = new Array("January","February","March","April","May","June","July","August","September","October","November","December");
var dpWkdays = new Array("Su","Mo","Tu","We","Th","Fr","Sa","Su");
function resizeWin() {
neededH = Math.min(700,document.getElementById('bodyArea').offsetHeight + 6); //max height: 700px
currentH = window.innerHeight ? window.innerHeight : document.documentElement.clientHeight;
window.resizeBy(0,neededH-currentH);
}
</script>
<script type="text/javascript" src="common/dtpicker.js"></script>
<script type="text/javascript" src="common/cpicker.js"></script>
<script type="text/javascript" src="common/poptext.js"></script>
<script type="text/javascript" src="common/general.js"></script>
</head>
<body onLoad="resizeWin();" class="scroll">
<div id="bodyArea">
<div class="topText">
<h4 class="floatL">Create Schedule</h4>
</div>
<div class="contentS">
<script type="text/javascript">
function hide_times(t) {
if (t.checked) {
document.getElementById("dTimeS").style.visibility = "hidden";
document.getElementById("dTimeE").style.visibility = "hidden";
} else {
document.getElementById("dTimeS").style.visibility = "visible";
document.getElementById("dTimeE").style.visibility = "visible";
t.form.start_time.value = t.form.end_time.value = "";
}
}
</script>
<form id="event" name="event" method="post" action="index.php?xP=10">
<input type="hidden" name="id" value="0" />
<input type="hidden" name="mode" value="add" />
<table class="evtForm">
<col width='100px' /><col width='100px' /><col width='150px' /><col />
<tr>
<tr><td>Services:</td>
<td><select id="svc" name="svc"><option value="1" style="color: #000000; background: #00FF00;">Value1</option>
<option value="3" style="color: #000000; background: #FFFFFF;">Value1</option>
<option value="4" style="color: #000000; background: #33FFFF;">Value2</option>
<option value="6" style="color: #000000; background: #FF9999;">Value3</option>
</select></td></tr><tr><td>Contact Number:</td>
<td><input type=text name=ven id=ven value='' size=28 style=width:150% /></td>
</tr><tr><td>Initials:</td>
<td><input type=text name=pri id=pri value='' size=28 style=width:150% /></td>
</tr><td>Barber:</td>
<td><select id="cat" name="cat"><option value="1" style="color: #000000; background: #00FF00;">DMITRIY</option>
<option value="3" style="color: #000000; background: #FFFFFF;">User1</option>
<option value="4" style="color: #000000; background: #33FFFF;">User2</option>
<option value="6" style="color: #000000; background: #FF9999;">User3</option>
</select></td><tr><td>Start:</td>
<td><input type="text" name="sda" id="sda" value='01.07.2011' size="8" /><input class="button" type="button" title="Select Date" value="..." onclick="dPicker('nill','sda','eda');" /></td>
<td id="dTimeS"><input type="text" name="sti" id="sti" value='08:00' size="6" /><a href="#" onclick="tPicker('sti')"><img src="images/time.png" alt="time picker" /></a></td>
<tr><td>End:</td>
<td><input type="text" name="eda" id="eda" value="" size="8" /><input class="button" title="Select Date" type="button" value="..." onclick="dPicker('nill','eda','sda');" /></td>
<td id="dTimeE"><input type="text" name="eti" id="eti" value='08:30' size="6" /><a href="#" onclick="tPicker('eti')"><img src="images/time.png" alt="time picker" <td/></a>
</tr>
<tr><td colspan="4"><hr /></td></tr>
<tr>
<td>Send mail:</td>
<td colspan="3">
<input type="checkbox" name="non" value="yes" /> now and/or
<input type="text" name="not" maxlength="2" style="width:20px" value="" /> day(s) before event to: </td>
</tr>
<tr>
<td colspan="4">
<input type="text" name="nml" id="nml" style="width:100%" value="[email protected]" />
<div class="fontS">(email addresses separated by a semicolon - max. 255 chars.)</div>
</td>
</tr>
</table>
<div class='repBox' id='repBox'>
<div class="floatC"><b>Set Repetition</b><hr /></div>
<div>
<input type="radio" name="r_t" id="r_t" value="0" checked="checked" /> No repeat <br />
<input type="radio" name="r_t" id="r_t" value="1" /> Repeat <select name="ri1" id="ri1">
<option value="1">every</option>
<option value="2">every other</option>
<option value="3">every third</option>
<option value="4">every fourth</option>
</select>
<select name="rp1" id="rp1">
<option value="1">day</option>
<option value="2">week</option>
<option value="3">month</option>
<option value="4">year</option>
</select>
*)<br />
<input type="radio" name="r_t" id="r_t" value="2" /> Repeat every <select name="ri2" id="ri2">
<option value="1">first</option>
<option value="2">second</option>
<option value="3">third</option>
<option value="4">fourth</option>
<option value="5">last</option>
</select>
<select name="rp2" id="rp2">
<option value="1">Monday</option>
<option value="2">Tuesday</option>
<option value="3">Wednesday</option>
<option value="4">Thursday</option>
<option value="5">Friday</option>
<option value="6">Saturday</option>
<option value="7">Sunday</option>
</select>
of the month *)<br /><br />
*) until <input type="text" name="rul" id="rul" value="" size="8" />
<input class="button" title="Select Date" type="button" value="..." onclick="dPicker('nill','rul','sda');" />
(blank: no end)
</div>
<div class="floatC"><hr /><input class="button" type="submit" name="refresh" value="OK" /></div>
</div>
<div class="floatC">
<input class="button" type="submit" name="add_exe_cls" value="Add" /> <input class="button" type="button" onClick="javascript:self.close()" value="Close" />
</div>
</form>
<script type="text/javascript">document.getElementById("tit").focus();</script></div>
</body>
</html>
と問題があります？ –
これはjqueryポップアップに移植する方法を理解できません – Shmie