How to apply/change CSS dynamically

0 comments

Following is the sequence of Screenshot which depicts how the css is toggled dynamicaly using javascript. The CSS of the element is changed dynamicaly using javascript fuction.

1.  No CSS yet applied

Following are the html elements which create above page when page is being run.

1<div id="dvMessage">
2  Please enter your valid user name and password.
3</div>
4<asp:Button Text="Toggle CSS" runat="server" ID="btnChange" OnClientClick="javascript:changeCSSClass('dvMessage');return false;" />

2.  When User click's Toggle CSS button for the first time

Following is the CSS applied to the <div> element when user click the Toggle CSS button.
1.Error
2{
3            font-family:Times New Roman Baltic;
4            font-size:13;
5            color:Red;
6            height:30px;
7}

3.  When User click's Toggle CSS button for the second time



Following is the CSS applied to the <div> element when user clicks the Toggle CSS button.

0 comments: