Я хочу показать результат div, когда я нажал кнопку asp с помощью css3

Question

Я хочу показать результат div, когда я нажал кнопку asp с помощью css3 с замедленным движением, пожалуйста, любой может мне помочь.

<div id="showdivslowly" runat="server" style="width:500px; height:200px; background-color:Blue ;display:none" >Welcome</div> 

    <asp:Button ID="Button1" runat="server" Text="Button" /> 

Answer 1

Это почти наверняка будет лучше всего сделать на стороне клиента через Ajax call на сервер, чтобы получить результат и добавить его в скрытый DIV, который вы анимировать либо с помощью CSS transitions или с помощью jQuery animation methods like fadeIn. Поскольку свойство отображения CSS имеет значение not animatable using CSS transitions, вам нужно будет либо использовать opacity property (который будет not be fully supported cross-browser, хотя он, вероятно, достаточно поддерживается для большинства целей, и только анимация будет затронута, а не основная функциональность) или с помощью методов jQuery.

Если вы обрабатываете событие click на стороне сервера, браузер завершает полную перепечатку страницы, вы можете добавить div с помощью кода на стороне сервера, а затем использовать либо переход CSS3, либо JavaScript для завершения клика анимации боковая сторона.

Для кода

ственного образца

.result { 
    -moz-transition: opacity 500ms ease-in-out 0s; 
    -o-transition: opacity 500ms ease-in-out 0s; 
    -webkit-transition: opacity 500ms ease-in-out 0s; 
    transition: opacity 500ms ease-in-out 0s; } 

.result.hidden { 
    display: none; 
    opacity: 0;  
} 

.result.shown { 
    display: block; 
    opacity: 1; 
}