备份下，以后会用得着
/***********************************CSS*******************************************/
@charset "utf-8";
/* CSS Document */
.bg_total_div{ 480px; height:auto;display:none;}
.bg_total_div div.top{ 480px; height:10px;padding-left:10px; background-image:url(../images/bg_all.png); background-repeat:no-repeat; background-position:0px 0px;}
.bg_total_div div.middle{ 468px; height:auto; border-left:1px #a3d5e5 solid; border-right:1px #a3d5e5 solid;padding-left:10px;
filter:progid:DXImageTransform.Microsoft.gradient(startcolorstr=#e1f0f5,endcolorstr=#ffffff,gradientType=0)/*IE浏览器*/;
background:-webkit-gradient(linear, 0% 0%, 0% 100%, from(#e1f0f5), to(#ffffff))/*谷歌浏览器*/;
background:-moz-linear-gradient(top,#e1f0f5,#ffffff)/*火狐浏览器*/; }
.bg_total_div div.down{ 480px; height:10px;padding-left:10px; background-image:url(../images/bg_all.png); background-repeat:no-repeat; background-position:0px -15px;}
div.left_calendar_div div.main_div_title{ margin-bottom:5px;}
div.left_calendar_div div.mySchedule{text-align: center;}
div.left_calendar_div div.mySchedule div.sSubject{ 100%; padding: 2px 0px 0px 0px;}
div.left_calendar_div div.mySchedule div.mouseoverCss{background-color: #e1f1ff;}
/***********************************HTML*******************************************/
<script type="text/javascript"> $(function () { var WebPart = { ExchangeUrl: '<%= WebPart.ExchangeUrl %>', MaxItemCount: parseInt('<%= WebPart.MaxItemCount %>'), MaxCharSizePerItem: parseInt('<%= WebPart.MaxCharSizePerItem %>'), ShowSchedulerInNextDays: parseInt('<%= WebPart.ShowSchedulerInNextDays %>') } RenderMyScheduler('<%= MySchedulerList.ClientID %>', WebPart); }); </script> <div id="MySchedulerList" class="mySchedulerList" runat="server"> <p class="title" title='<%= WebPart.Description %>'> <span> <%= WebPart.Title%></span></p> <span class="more"><a href="#" onclick="openwin_Scheduler<%=MoreUrl %>">>>更多</a> </span> <div id="sSubject" class="sSubject" style="text-align: left; height: 140px; overflow: auto;"> </div> <div class="img"> </div> </div> <div id="sBody" style="position: absolute; 480px; padding-left: 5px; z-index:999; text-indent:"> </div> /***********************JS代码************/ /************************************************************** * Author: Jerry Bai * Create Date: 2011/9/13 * Description: Render my scheduler from json string * Licence: BSD ***************************************************************/ function RenderMyScheduler(MySchedulerListID, WebPart) { $("#sSubject").empty() $("#sBody").empty(); $.ajax({ url: '/_layouts/CIMC.EIP.GPortal.UI/MyScheduler.ashx', dataType: 'text', timeout: 300000, data: 'ExchangeUrl=' + encodeURIComponent(WebPart.ExchangeUrl) + '&MaxItemCount=' + WebPart.MaxItemCount.toString() + '&ShowSchedulerInNextDays=' + WebPart.ShowSchedulerInNextDays, success: function (response) { if (typeof response == "string") { response = response.toJson(); } if (response && response.data) { var schedulerItemHTML = ''; for (var i in response.data) { var calendarItem = response.data[i]; var startTime = calendarItem.StartTime.substr(0, 16); var endTime = calendarItem.EndTime.substr(0, 16); var startDate = calendarItem.StartTime.substr(0, 10).toDate(); var todayOrTomorrow = ''; var _today = new Date(); var _todayYear = parseInt(_today.getFullYear()); var _todayMonth = parseInt(_today.getMonth()); var _todayDay = parseInt(_today.getDate()); _today = new Date(_todayYear, _todayMonth, _todayDay); if (startDate.valueOf() < new Date(_todayYear, _todayMonth, _todayDay).setDate(_today.getDate() - 2)) { todayOrTomorrow = '古 '; } else if (startDate.valueOf() == new Date(_todayYear, _todayMonth, _todayDay).setDate(_today.getDate() - 2)) { todayOrTomorrow = '前 '; } else if (startDate.valueOf() == new Date(_todayYear, _todayMonth, _todayDay).setDate(_today.getDate() - 1)) { todayOrTomorrow = '昨 '; } else if (startDate.valueOf() == new Date(_todayYear, _todayMonth, _todayDay).valueOf()) { todayOrTomorrow = '今 '; } else if (startDate.valueOf() == new Date(_todayYear, _todayMonth, _todayDay).setDate(_today.getDate() + 1)) { todayOrTomorrow = '明 '; } else if (startDate.valueOf() == new Date(_todayYear, _todayMonth, _todayDay).setDate(_today.getDate() + 2)) { todayOrTomorrow = '后 '; } else { todayOrTomorrow = '未 '; } schedulerItemHTML += '<div class="myScaheduleTitle">'; schedulerItemHTML += todayOrTomorrow + startTime.split(' ')[1].substr(0, 5); schedulerItemHTML += '<a href="'; schedulerItemHTML += calendarItem.Source == WebPart.ListTitle ? WebPart.ItemDetailUrlFormatString.replace('{0}', calendarItem.Identity) : ('#" onclick="openwin_Scheduler' + calendarItem.CategoryName); schedulerItemHTML += '">'; schedulerItemHTML += calendarItem.Subject.SpecifiedLengthString(parseInt(WebPart.MaxCharSizePerItem)); schedulerItemHTML += '</a>'; schedulerItemHTML += '</div>'; $("#sSubject").append(schedulerItemHTML); schedulerItemHTML = ""; //add by hai wang $("#sBody").append($('<div class="bg_total_div"><div class="top" ></div>' + '<div class="middle myScaheduleBody"><ul><li>标题：' + calendarItem.Subject + '</li><li>时间：' + startTime + '至' + endTime + '</li><li>地点：' + calendarItem.Location + '</li><li>内容：' + calendarItem.Body + '</li></ul></div>' + '<div class="down"></div></div>')); } var $subject = $("#sSubject").children(); $.each($subject, function (index, sub) { var $curS = $(sub); var $curB = $("#sBody").children().eq(index); var $wHeight = $(window).height(); //window height var $bWidth = $("#sBody").outerWidth(); var $bHeight = $curB.outerHeight(); //var $curP = $wHeight - $curS.offset().top; var $theHeight = 400; //设定上限高度 if ($curB.height() > $theHeight) { $curB.css("height", $theHeight + "px"); } var $left = $curS.offset().left - $bWidth; if ($left < 0) { $left = $curS.offset().left + $curS.width(); } $(sub).mouseover(function (e) { $curS.addClass('mouseoverCss'); //$("#sBody").css({ "top": (e.pageY) + "px", "left": (e.pageX) + "px" });//位置跟随鼠标移动 if ($bHeight < $theHeight) { $("#sBody").offset({ top: ($curS.offset().top - $bHeight / 2), left: $left }); ; //绝对定位 } else { $("#sBody").offset({ top: ($curS.offset().top - $theHeight / 2), left: $left }); ; //绝对定位 } $curB.show(); }).mouseout(function () { $curS.removeClass('mouseoverCss'); $curB.hide(); }); //鼠标放入详细面板显示 $curB.mouseover(function () { $curS.addClass('mouseoverCss'); $curB.show(); }).mouseout(function () { $curS.removeClass('mouseoverCss'); $curB.hide(); }); }); } }, error: function (XMLHttpRequest, textStatus, errorThrown) { Firebug.debug('Call RenderMyScheduler fail' + textStatus + '\r\n Request Url:' + this.url); } }); }