Wednesday, October 19, 2011
Ajax Calender Style for new look
1) Add Ajax Control dll
2)Register dll in HTML source page
<%@ Register assembly="AjaxControlToolkit" namespace="AjaxControlToolkit" tagprefix="ajaxToolkit" %>
2)Register dll in HTML source page
<%@ Register assembly="AjaxControlToolkit" namespace="AjaxControlToolkit" tagprefix="ajaxToolkit" %>
3)Write stylesheet for new look
body {
}
.cal_Theme1 .ajax__calendar_container
{
background-color: #e2e2e2; border:solid 1px #cccccc;
}
.cal_Theme1 .ajax__calendar_header
{
background-color: #ffffff; margin-bottom: 4px;
}
.cal_Theme1 .ajax__calendar_title,
.cal_Theme1 .ajax__calendar_next,
.cal_Theme1 .ajax__calendar_prev
{
color: #004080; padding-top: 3px;
}
.cal_Theme1 .ajax__calendar_body
{
background-color: #e9e9e9; border: solid 1px #cccccc;
}
.cal_Theme1 .ajax__calendar_dayname
{
text-align:center; font-weight:bold; margin-bottom: 4px; margin-top: 2px;
}
.cal_Theme1 .ajax__calendar_day
{
text-align:center;
}
.cal_Theme1 .ajax__calendar_hover .ajax__calendar_day,
.cal_Theme1 .ajax__calendar_hover .ajax__calendar_month,
.cal_Theme1 .ajax__calendar_hover .ajax__calendar_year,
.cal_Theme1 .ajax__calendar_active
{
color: #004080; font-weight:bold; background-color: #ffffff;
}
.cal_Theme1 .ajax__calendar_today
{
font-weight:bold;
}
.cal_Theme1 .ajax__calendar_other,
.cal_Theme1 .ajax__calendar_hover .ajax__calendar_today,
.cal_Theme1 .ajax__calendar_hover .ajax__calendar_title
{
color: #bbbbbb;
}
4)call style sheet in head tag
<link href="StyleSheet.css" rel="stylesheet" type="text/css" />
5)Write code in from tag
<form id="form1" runat="server">
<div>
<asp:ScriptManager ID="ScriptManager1" runat="server">
</asp:ScriptManager>
<ajaxToolkit:CalendarExtender ID="CalendarExtender1" runat="server" CssClass="cal_Theme1"
TargetControlID="TextBox1" PopupPosition="Right">
</ajaxToolkit:CalendarExtender>
</div>
<asp:TextBox ID="TextBox1" runat="server"></asp:TextBox>
</form>
Thursday, October 13, 2011
JQuery Message FadeIn And FateOut
- <html xmlns="http://www.w3.org/1999/xhtml">
- <head>
- <title>jQuery from Microsoft AJAX CDN</title>
- <script src="http://ajax.aspnetcdn.com/ajax/jquery/jquery-1.5.js"></script>
- <script>
- $( domReady );
- function domReady() {
- $('#btn').click( showMessage );
- }
- function showMessage() {
- $('#message').fadeIn('slow');
- }
- </script>
- <script>
- $( domReady );
- function domReady() {
- $('#btnhide').click( hideMessage );
- }
- function hideMessage() {
- $('#message').fadeOut('slow');
- }
- </script>
- </head>
- <body>
- <button id="btn">Show Message</button>
- <button id="btnhide">HideMessage</button>
- <div id="message" style="display:none">
- <h1>Hello from jQuery!</h1>
- </div>
- </body>
- </html>
Wednesday, October 12, 2011
what is the difference between javascript and jquery
1. Javascript
A language that comes with your browser. It allows you to show an alert box, the one that you need to press Ok, validate forms, on the client, or without change the page. Usually, it is stopped by an alert, confirm, etc box.
2. jQuery
A library code made with Javascript, that make easier to program Javascript and AJAX. You can download it on jquery.com .
3. AJAX
Asynchronous Javascript And XML. Which means that with a help from a programming language like PHP, ASP.NET and etc. it can work changing data without refresh the whole page, just the part of the data will be refreshed.
A language that comes with your browser. It allows you to show an alert box, the one that you need to press Ok, validate forms, on the client, or without change the page. Usually, it is stopped by an alert, confirm, etc box.
2. jQuery
A library code made with Javascript, that make easier to program Javascript and AJAX. You can download it on jquery.com .
3. AJAX
Asynchronous Javascript And XML. Which means that with a help from a programming language like PHP, ASP.NET and etc. it can work changing data without refresh the whole page, just the part of the data will be refreshed.
Subscribe to:
Posts (Atom)