No replies
Mutlyp
Mutlyp's picture
Offline
newbie
Last seen: 11 years 6 days ago
Timezone: GMT-7
Joined: 2011-08-09
Posts: 1
Points: 2

I have created a page with 4 CSS buttons and one other Grpahic on the page. The CSS buttons are the ones where it's a picture and each button has 2 pictures that stand on top of each other. When the mouse rolls over the button the Top Picture goes away and shows the bottom picture.
All 4 buttons work great. The problem is on the last button. So I have all 4 css buttons on one row (one DIV) then below those buttons I have another div with a logo/picture. But when I put the mouse over this logo the last css button changes to the bottom view and if I click on the logo it is as if I clicked on the last css button.
How can I stop this????

HTML Code:
-----------------------------------------------------------------------------------------------------
@ Page Language="VB" AutoEventWireup="false" CodeFile="reg_Location.aspx.vb" Inherits="reg_Location"

@ Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="asp"

@ Register src="UserControls/Footer.ascx" tagname="Footer" tagprefix="uc1"

--<script type="text/javascript">	
 
			function InitialLoad()    
    {        
        var home = document.getElementById("pnlButtons");        
        home.style.opacity="0";               
        home.style.display="block";            
    }
		</script>--

#BBButtons
{
height: 188px;
width: 600px;
}

--<asp:Panel ID="Panel1" runat="server" Width="606px" HorizontalAlign="Center">
            <asp:Label ID="Label1" runat="server" Font-Bold="true" Text="Please Select Your Location:"></asp:Label>
 
                <div class="ESrollovers">
                    <a  href="#"  onclick="javascript:__doPostBack('Button1', '');" />
                </div>
 
                <div class="RBrollovers">
                    <a  href="#"  onclick="javascript:__doPostBack('Button3', '');" />
                </div>
 
 
                 <div class="PDrollovers">
                    <a  href="#"  onclick="javascript:__doPostBack('Button2', '');" />
                </div>
 
 
                 <div class="MProllovers" visible="false">
                    <a  href="#" visible="false"  onclick="javascript:__doPostBack('Button4', '');" />
                </div>
 
                <div class="SProllovers">
                    <a  href="#"  onclick="javascript:__doPostBack('Button5', '');" />
                </div>
 
 
    </asp:Panel>--

--<asp:AnimationExtender ID="AnimationExtender2" runat="server" TargetControlID="pnlButtons">
            <Animations>
                <OnLoad>
                    <Sequence>
                        <ScriptAction Script="InitialLoad();" />
                        <FadeIn Duration="2.0" Fps="24" AnimationTarget="pnlButtons" />
                    </Sequence>
                </OnLoad>
            </Animations>
        </asp:AnimationExtender>--

---------------------------------------------------------------------------------------------------------
Code Behind
---------------------------------------------------------------------------------------------------------

Partial Class reg_Location
Inherits System.Web.UI.Page

Protected Sub Button1_Click(ByVal sender As Object, ByVal e As System.EventArgs) Handles Button1.Click
Session("Location") = "El Segundo"
Session("LocValue") = "1"
Response.Redirect("reg_RegType.aspx", False)
End Sub

Protected Sub Button2_Click(ByVal sender As Object, ByVal e As System.EventArgs) Handles Button2.Click
'Response.Redirect("Suggestions.aspx?RouteID=PD", False)
Session("Location") = "Palmdale"
Session("LocValue") = "3"
Response.Redirect("reg_RegType.aspx", False)
End Sub

Protected Sub Button3_Click(ByVal sender As Object, ByVal e As System.EventArgs) Handles Button3.Click
Session("Location") = "Rancho Bernardo"
Session("LocValue") = "4"
Response.Redirect("reg_RegType.aspx", False)
End Sub

' '' ''Protected Sub Button4_Click(ByVal sender As Object, ByVal e As System.EventArgs) Handles Button4.Click
' '' '' Session("Location") = "Moss Point"
' '' '' Session("LocValue") = "5"
' '' '' Response.Redirect("reg_Registration.aspx", False)
' '' ''End Sub

Protected Sub Button5_Click(ByVal sender As Object, ByVal e As System.EventArgs) Handles Button5.Click
Session("Location") = "Space Park"
Session("LocValue") = "2"
Response.Redirect("reg_RegType.aspx", False)
End Sub
End Class
-----------------------------------------------------------------------------------------------------------------
CSS/LocPick.css
-----------------------------------------------------------------------------------------------------------------

body {
}

.ESrollovers a
{
display:block;
height:191px;
width:150px;
background:url(../images/ESRollOverButton.jpg) no-repeat
}
.ESrollovers a:hover{
background-position:bottom
}
.ESrollovers
{
float:left;
height:191px;
width:150px;
/*margin:0 40px 20px;*/
background:url(../images/ESRollOverButton.jpg) no-repeat
}

.PDrollovers a
{

height:191px;
width:150px;
display:block;
background:url(../images/PDButtonRollOver.jpg) no-repeat
}
.PDrollovers a:hover{
background-position:bottom
}
.PDrollovers
{
float:left;
height:191px;
width:150px;
/*margin:0 40px 20px;*/
background:url(../images/PDButtonRollOver.jpg) no-repeat
}

.RBrollovers a{
height:191px;
width:150px;
display:block;
background:url(../images/RBButtonRollOver.jpg) no-repeat
}
.RBrollovers a:hover{
background-position:bottom
}
.RBrollovers
{
float:left;
height:191px;
width:150px;
/*margin:0 40px 20px;*/
background:url(../images/RBButtonRollOver.jpg) no-repeat
}

.SProllovers a{
height:191px;
width:150px;
display:block;
background:url(../images/SPButtonRollOver.jpg) no-repeat
}
.SProllovers a:hover{
background-position:bottom
}
.SProllovers
{
float:left;
height:191px;
width:150px;
/*margin:0 40px 20px;*/
background:url(../images/SPButtonRollOver.jpg) no-repeat
}