Hi Imar,

I'm unable to get this functionality....

function pageLoad()
{
$('Attention').animate({ width: '600px' }, 3000).animate({ width: '100px' }, 3000).fadeOut('slow');
}

Here's the source....

<%@ Control Language="C#" AutoEventWireup="true" CodeFile="ContactForm.ascx.cs" Inherits="Controls_ContactForm" %>
<% if (false) { %>
<script src="../Scripts/jquery-1.4.1-vsdoc.js" type="text/javascript"></script>
<% } %>


<style type="text/css">
.style1
{

}
.style2
{
}
</style>


<script type="text/javascript">
function ValidatePhoneNumbers(source, args)
{
var phoneHome = document.getElementById('<%= PhoneHome.ClientID %>');
var phoneBusiness = document.getElementById('<%= PhoneBusiness.ClientID %>');

if (phoneHome.value != '' || phoneBusiness.value != '')
{
args.IsValid = true;
}
else
{
args.IsValid = false;
}
}
</script>



<asp:UpdatePanel ID="UpdatePanel1" runat="server">

<ContentTemplate>

<div id="TableWrapper">
<table class="style1" runat="server" id="FormTable">
<tr>
<td colspan="3">
<h1>Get in touch with us</h1>

<p>Use the form below to get in touch with us. Enter your name, e-mail
address, and your home or business phone number to get in touch with us.</p>
</td>
</tr>
<tr>
<td class="style2">
Name</td>
<td>
<asp:TextBox ID="Name" runat="server" style="margin-left: 0px"></asp:TextBox>
</td>
<td>
<asp:RequiredFieldValidator ID="RequiredFieldValidator1" runat="server"
ErrorMessage="Enter Your Name" ControlToValidate="Name"
CssClass="ErrorMessage" Display="Dynamic">*</asp:RequiredFieldValidator>
</td>
</tr>
<tr>
<td class="style2">
E-mail address</td>
<td>
<asp:TextBox ID="EmailAddress" runat="server"></asp:TextBox>
</td>
<td>
<asp:RequiredFieldValidator ID="RequiredFieldValidator2" runat="server"
ControlToValidate="EmailAddress" CssClass="ErrorMessage"
ErrorMessage="Enter an e-mail address" Display="Dynamic">*</asp:RequiredFieldValidator>
<asp:RegularExpressionValidator ID="RegularExpressionValidator1" runat="server"
ControlToValidate="EmailAddress" CssClass="ErrorMessage"
ErrorMessage="Enter a valid e-mail address"
ValidationExpression="\w+([-+.']\w+)*@\w+([-.]\w+)*\.\w+([-.]\w+)*"
Display="Dynamic">*</asp:RegularExpressionValidator>
</td>
</tr>
<tr>
<td class="style2">
E-main address again</td>
<td>
<asp:TextBox ID="ConfirmEmailAddress" runat="server"></asp:TextBox>
</td>
<td>
<asp:RequiredFieldValidator ID="RequiredFieldValidator3" runat="server"
ControlToValidate="ConfirmEmailAddress" CssClass="ErrorMessage"
ErrorMessage="Confirm the e-mail address" Display="Dynamic">*</asp:RequiredFieldValidator>
<asp:CompareValidator ID="CompareValidator1" runat="server"
ControlToCompare="EmailAddress" ControlToValidate="ConfirmEmailAddress"
CssClass="ErrorMessage" ErrorMessage="Retype the e-mail address"
Display="Dynamic">*</asp:CompareValidator>
</td>
</tr>
<tr>
<td class="style2">
Home phone number</td>
<td>
<asp:TextBox ID="PhoneHome" runat="server"></asp:TextBox>
</td>
<td>
<asp:CustomValidator ID="CustomValidator1" runat="server"
ClientValidationFunction="ValidatePhoneNumbers" Display="Dynamic"
ErrorMessage="Enter your home or business phone number"
onservervalidate="CustomValidator1_ServerValidate" CssClass="ErrorMessage">*</asp:CustomValidator>
</td>
</tr>
<tr>
<td class="style2">
Business phone number</td>
<td>
<asp:TextBox ID="PhoneBusiness" runat="server"></asp:TextBox>
</td>
<td>
&nbsp;</td>
</tr>
<tr>
<td class="style2">
Comments</td>
<td>
<asp:TextBox ID="Comments" runat="server" Height="84px" TextMode="MultiLine"
Width="260px"></asp:TextBox>
</td>
<td>
<asp:RequiredFieldValidator ID="RequiredFieldValidator4" runat="server"
ControlToValidate="Comments" CssClass="ErrorMessage" Display="Dynamic"
ErrorMessage="Enter a comment">*</asp:RequiredFieldValidator>
</td>
</tr>
<tr>
<td class="style2">
&nbsp;</td>
<td>
<asp:Button ID="SendButton" runat="server" Text="Send"
onclick="SendButton_Click" />
</td>
<td>
&nbsp;</td>
</tr>
<tr>
<td class="style2" colspan="3">
<asp:ValidationSummary ID="ValidationSummary1" runat="server"
CssClass="ErrorMessage"
HeaderText="Please correct the following errors before you press the Send button:" />
</td>
</tr>
</table>
</div>

<asp:Label ID="Message" runat="server" Text="Message Sent" Visible="false" CssClass="Attention"></asp:Label>

<p runat="server" id="MessageSentPara" visible="false">Thank you for your message. We'll get in touch with you if necessary.</p>

</ContentTemplate>

</asp:UpdatePanel>

<asp:UpdateProgress ID="UpdateProgress1" runat="server" AssociatedUpdatePanelID="UpdatePanel1">
<ProgressTemplate>
<div class="PleaseWait">Please Wait... </div>
</ProgressTemplate>
</asp:UpdateProgress>

<script type="text/javascript">
$(function () {
$(':input[type=text], textarea').each
(
function () {

var newText = 'Please enter your ' +
$(this).parent().prev().text().toLowerCase().trim( );

$(this).attr('value', newText);
}).one('focus', function () {
this.value = '', this.className = ''
}).addClass('Watermark').css('width', '300px');

$('form').bind('submit', function () {
if (Page_IsValid) {
$('#TableWrapper').slideUp(3000);
}
});
});

function pageLoad()
{
$('Attention').animate({ width: '600px' }, 7000).animate({ width: '100px' }, 7000).fadeOut('slow');
}

</script>

I'm not sure what I'm doing wrong?

Thanks.

Tulsi

Hi Tulsi,

Take a look at this:

$('Attention').animate

There's a dot missing in front of Attention.

Hope this helps,

Imar

__________________
Imar Spaanjaars
http://Imar.Spaanjaars.Com
Follow me on Twitter

Author of Beginning ASP.NET 4.5 : in C# and VB, Beginning ASP.NET Web Pages with WebMatrix
and Beginning ASP.NET 4 : in C# and VB.
Did this post help you? Click the button below this post to show your appreciation!