need some help to this javascript function;
<script type="text/javascript">
function MyFunction() {
//Get values from textboxes that wiil be passed to function
var ceoname = document.getElementById('<%=lblCEOName.ClientID %>').value;
var ceoimgurl = document.getElementById('<%=lblCEOImgUrl.ClientID %>').value;
PageMethods.SetImageCEO(onSucess, onError);
function onSucess() {
$get('lblName').innerHTML =ceoname;
$get('empImg').innerHTML =ceoimgurl;
}
function onError(error) {
alert("Error: " + error.get_message());
}
}
function clr() {
$get('lblName').innerHTML =""; //clear name of employee
$get('empImg').innerHTML =""; //hide image
}
</script>
<table width="100%">
<tr>
<td align="center">
<table border="1">
<tr>
<td rowspan="4" style="width: 100px">
<asp:Image ID="empImg" runat="server" Height="225px" Width="225px" /></td>
<td style="width: 100px">
<a href="#" onmouseover="MyFunction();return false" onmouseout="clr(); ">CEO</a></td>
</tr>
<tr>
<td style="width: 100px">
<asp:Label ID="lblCEOImgUrl" runat="server" Font-Bold="True" Font-Names="Arial" Font-Size="10pt"
ForeColor="#003399" Height="23px" Width="250px"></asp:Label>
<asp:Label ID="lblCEOName" runat="server" Font-Bold="True" Font-Names="Arial" Font-Size="10pt"
ForeColor="#003399" Height="23px" Width="250px"></asp:Label></td>
</tr>
<tr>
<td style="width: 100px">
<a href="#">Head 1</a></td>
</tr>
<tr>
<td style="width: 100px">
<asp:Label ID="lblH1ImgUrl" runat="server" Font-Bold="True" Font-Names="Arial" Font-Size="10pt"
ForeColor="#003399" Height="23px" Width="250px"></asp:Label>
<asp:Label ID="lblH1Name" runat="server" Font-Bold="True" Font-Names="Arial" Font-Size="10pt"
ForeColor="#003399" Height="23px" Width="250px"></asp:Label></td>
</tr>
<tr>
<td colspan="2">
<asp:Label ID="lblName" runat="server" Font-Bold="True" Font-Names="Arial" Font-Size="10pt"
ForeColor="#003399" Height="23px" Width="100%"></asp:Label></td>
</tr>
</table>
</td>
</tr>
<tr>
<td align="center">
<table border="1">
<tr>
<td align="left" style="width: 150px; height: 21px;"><a href="#">Sec A</a></td>
<td align="left" style="width: 150px; height: 21px;"><a href="#">Sec B</a></td>
<td align="left" style="width: 150px; height: 21px;"><a href="#">Sec C</a></td>
<td align="left" style="width: 150px; height: 21px;"><a href="#">Sec D</a></td>
<td align="left" style="width: 150px; height: 21px;"><a href="#">Sec E</a></td>
<td align="left" style="width: 150px; height: 21px;"><a href="#">Sec F</a></td>
</tr>
<tr>
<td align="left" style="width: 150px; height: 21px">
<asp:Label ID="lblSAImgUrl" runat="server" Font-Bold="True" Font-Names="Arial" Font-Size="10pt"
ForeColor="#003399" Height="23px" Width="250px"></asp:Label></td>
<td align="left" style="width: 150px; height: 21px">
<asp:Label ID="lblSBImgUrl" runat="server" Font-Bold="True" Font-Names="Arial" Font-Size="10pt"
ForeColor="#003399" Height="23px" Width="250px"></asp:Label></td>
<td align="left" style="width: 150px; height: 21px">
<asp:Label ID="lblSCImgUrl" runat="server" Font-Bold="True" Font-Names="Arial" Font-Size="10pt"
ForeColor="#003399" Height="23px" Width="250px"></asp:Label></td>
<td align="left" style="width: 150px; height: 21px">
<asp:Label ID="lblSDImgUrl" runat="server" Font-Bold="True" Font-Names="Arial" Font-Size="10pt"
ForeColor="#003399" Height="23px" Width="250px"></asp:Label></td>
<td align="left" style="width: 150px; height: 21px">
</td>
<td align="left" style="width: 150px; height: 21px">
</td>
</tr>
<tr>
<td align="left" style="width: 150px; height: 21px">
<asp:Label ID="lblSAName" runat="server" Font-Bold="True" Font-Names="Arial" Font-Size="10pt"
ForeColor="#003399" Height="23px" Width="250px"></asp:Label></td>
<td align="left" style="width: 150px; height: 21px">
<asp:Label ID="lblSBName" runat="server" Font-Bold="True" Font-Names="Arial" Font-Size="10pt"
ForeColor="#003399" Height="23px" Width="250px"></asp:Label></td>
<td align="left" style="width: 150px; height: 21px">
<asp:Label ID="lblSCName" runat="server" Font-Bold="True" Font-Names="Arial" Font-Size="10pt"
ForeColor="#003399" Height="23px" Width="250px"></asp:Label></td>
<td align="left" style="width: 150px; height: 21px">
<asp:Label ID="lblSDName" runat="server" Font-Bold="True" Font-Names="Arial" Font-Size="10pt"
ForeColor="#003399" Height="23px" Width="250px"></asp:Label></td>
<td align="left" style="width: 150px; height: 21px">
</td>
<td align="left" style="width: 150px; height: 21px">
</td>
</tr>
</table>
</td>
</tr>
<tr>
<td align="left">
<table border="1">
<tr>
<td align="left" style="width: 250px"> <a href="#">Sub Dept A</a></td>
</tr>
<tr>
<td align="left" style="width: 250px"> <a href="#">Sub Dept B</a></td>
</tr>
<tr>
<td align="left" style="width: 250px"> <a href="#">Sub Dept C</a></td>
</tr>
<tr>
<td align="left" style="width: 250px"> <a href="#">Sub Dept D</a></td>
</tr>
<tr>
<td align="left" style="width: 250px"> <a href="#">Sub Dept E</a></td>
</tr>
<tr>
<td align="left" style="width: 250px"> <a href="#">Sub Dept F</a></td>
</tr>
</table>
</td>
</tr>
</table>
now the code behind
protected void Page_Load(object sender, EventArgs e)
{
if (!Page.IsPostBack)
{
popCEO(); // this will set employee name and its pic url to variable/labels
popHead1();
popSecA();
popSecB();
popSecC();
popSecD();
}
}
[WebMethod]
void SetImageCEO()
{
lblName.Text = lblCEOName.Text;
empImg.ImageUrl = lblCEOImgUrl.Text;
}
[WebMethod]
void SetImageHead1()
{
lblName.Text = lblH1Name.Text;
empImg.ImageUrl = lblH1ImgUrl.Text;
}
[WebMethod]
void SetImageSecA()
{
lblName.Text = lblSAName.Text;
empImg.ImageUrl = lblSAImgUrl.Text;
}
[WebMethod]
void SetImageSecB()
{
lblName.Text = lblSBName.Text;
empImg.ImageUrl = lblSBImgUrl.Text;
}
[WebMethod]
void SetImageSecC()
{
lblName.Text = lblSCName.Text;
empImg.ImageUrl = lblSCImgUrl.Text;
}
[WebMethod]
void SetImageSecD()
{
lblName.Text = lblSDName.Text;
empImg.ImageUrl = lblSDImgUrl.Text;
}
void popCEO()
{
lblCEOName.Text = "CEO of Company";
lblCEOImgUrl.Text = "~/Images/CEO.jpg";
}
void popHead1()
{
lblH1Name.Text = "Head1 of Company";
lblH1ImgUrl.Text = "~/Images/Head1.jpg";
}
void popSecA()
{
lblSAName.Text = "Sec A of Company";
lblSAImgUrl.Text = "~/Images/SecA.jpg";
}
void popSecB()
{
lblSBName.Text = "Sec B of Company";
lblSBImgUrl.Text = "~/Images/SecB.jpg";
}
void popSecC()
{
lblSCName.Text = "Sec C of Company";
lblSCImgUrl.Text = "~/Images/SecC.jpg";
}
void popSecD()
{
lblSDName.Text = "Sec D of Company";
lblSDImgUrl.Text = "~/Images/SecD.jpg";
}
-------------------
i need to call these functions when i move mouse over/out to any of the link.
this will show the employee pic and its name ;