CSSカレンダーとJqueryを使用して、ASPカレンダーでアニメーションを作成しようとしています。私はCSSを使用してカレンダーを隠し、いくつかのイベントが発生したときに、私はただフェードインします。カレンダーはAJAXの更新パネルの中にあります。カレンダーで1日をクリックすると、私の問題が発生します。 CSSは再起動してカレンダーを隠してしまい、Jquery(もちろん)は消えません。私が望むのは、クリックしてカレンダーを隠すのを避けることです。アイブは多くのことを試みましたが、何も動作しません。ここに私のコードの一部は次のとおりです。カレンダーのクリックによるCSS再アニメーションの防止方法
はJavaScript:
$(document).ready(
function()
{
...
var invoiceB = $(".invoiceBtnPos");
invoiceB.animate({ left: '92%' }, 1500,
function() {
var UserCalendarC = $("#UserCalendar");
UserCalendarC.fadeIn({ duration: 1500 });
UserCalendarC.classList.remove("DHidden");
});
});
CSS
.DHidden { display:none; }
ASPX
<asp:UpdatePanel ID="UpdateUserPanel" runat="server">
<contenttemplate>
<fieldset class="ZeroDecoration">
...
<asp:Calendar ID="UserCalendar" ClientIDMode="Static" runat="server" CssClass="Calendar DHidden" DayNameFormat="Full" ShowGridLines="True" Width="26%" Height="425px"
OnDayRender="UserCalendar_DayRender" NextMonthText="<img src='../Images/nextimg.png' border='0' width='60%' height='auto'>"
PrevMonthText="<img src='../Images/previmg.png' border='0' width='60%' height='auto'>" OnSelectionChanged="UserCalendar_SelectionChanged" >
<DayHeaderStyle CssClass="DayHeaderStyle" />
<DayStyle CssClass="DayStyle no_underline" ForeColor="White" />
<WeekendDayStyle CssClass="WeekendDayStyle no_underline" />
<NextPrevStyle CssClass="NextPrevStyle" />
<OtherMonthDayStyle CssClass="OtherMonthDayStyle no_underline" />
<SelectedDayStyle CssClass="SelectedDayStyle no_underline" />
<SelectorStyle CssClass="SelectorStyle" />
<TitleStyle CssClass="TitleStyle" />
<TodayDayStyle CssClass="TodayDayStyle no_underline" />
</asp:Calendar>
...
</fieldset>
</contenttemplate>
</asp:UpdatePanel>
CS
protected void UserCalendar_DayRender(object sender, DayRenderEventArgs e)
{
e.Cell.Text += e.Day.DayNumberText;
e.Cell.ToolTip = e.Day.Date.ToShortDateString();
e.Cell.Attributes.Add("OnClick",e.SelectUrl);
}
protected void UserCalendar_SelectionChanged(object sender, EventArgs e)
{
currentDate.Text = UserCalendar.SelectedDate.ToLongDateString();
}
私がやった最接近は冒頭で、また、JavaScriptでの表示プロパティを設定しますが、動作が奇妙に見えます(表示、非表示、その後、フェードイン)することです...
window.onload = function()
{
var calendar = $("#UserCalendar");
calendar.css("display", "none");
}
その私の最初の時間ここに尋ねます私が作ったかもしれないすべての間違いをお詫びします。