why this strange behaviour on ie6/7

Posted on 2011-05-04
Last Modified: 2012-08-13
Dear Experts,
 I used this particular css image roll over intentionally to avoid javascript imagechange and other css tricks as dis  provided the best & perfct situation on my application Untill i find this peculiar behavior on d ie6/7 brwser , whn i click d image button it causes postback after that  the mouseptr is still on the on d image and it displays hover image but it takes two clicks
for to cause postback when i move the mouse pointer and then bring back to the image  den it works properly . How to sort this issue?
Requirement:Image Change On Hover
Issue : IE $1X/$EVEN after postback , Improper behavior on hover of imagebutton  

waiting for ur valuable suggestion

<%@ Page Language="VB" AutoEventWireup="false" CodeFile="Default2.aspx.vb" Inherits="Default2" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" ""> 
<html xmlns=""> 
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 
.chan {
width: 16px;
height: 16px;
background-image: url(icon.gif);

.chan a {
color: #fff;
width: 16px;
height: 16px;
display: block;
text-decoration: none;
.chan a:hover {
.chan a span {
display: none;
width: 16px;

.chan a:hover span {
display: block;
<form id="form1" runat="server">
<div class="chan"><a  href="#"> 
    <asp:ImageButton ID="ImageButton1" runat="server" ImageUrl="~/info-over.gif" />

Imports System.Threading
Partial Class Default2
    Inherits System.Web.UI.Page
    Protected Sub ImageButton1_Click(ByVal sender As Object, ByVal e As System.Web.UI.ImageClickEventArgs) Handles ImageButton1.Click
    End Sub
End Class

Open in new window

Question by:Rajar Ahmed
    LVL 9

    Expert Comment

    Whats u want to do? Why are you using THREADS here?
    LVL 18

    Author Comment

    by:Rajar Ahmed
    dats just to show sum action on imagebutton click.
    i want to do image change on hover .
    LVL 3

    Accepted Solution


    I have created a sample html page, in this you will the image is changing on hover.

    let me know if this solution doesn't work for you .

    LVL 18

    Author Comment

    by:Rajar Ahmed
    hi deegoy418,

      There r few reason why i followed my approach since
       ie6 got issues when we change the image on hover or using javascript it downloads d image each time from d server and make d progress bar work so badly .
    They said it is d bug :

    As my example will overcome the problem faced by us but i dont know y on postback if we dint move d mouse, still on d same image and if we click d imagebutton  its not triggering postback

    y it is ?

    your Example dint worked on ie and also combined image is tds process now as all images  are kept seperately

    Thank u For Response .

    Hope to see some brighter side of this issue soon

    Featured Post

    How your wiki can always stay up-to-date

    Quip doubles as a “living” wiki and a project management tool that evolves with your organization. As you finish projects in Quip, the work remains, easily accessible to all team members, new and old.
    - Increase transparency
    - Onboard new hires faster
    - Access from mobile/offline

    Join & Write a Comment

    When applying CSS to your HTML, there are many different ways to select which element(s) the CSS applies to.  Some of these selectors are more commonly known and used than others - Here are the more common ones: #X - Matches an ID of X .X - Matche…
    Browsers only know CSS so your awesome SASS code needs to be translated into normal CSS. Here I'll try to explain what you should aim for in order to take full advantage of SASS.
    In this Micro Tutorial users will learn how to embed custom fonts into websites using @font-face in CSS Select a font: Ensure the EULA allows you to use @font-face: Download the font: Get the browser-compatible files you need: Edit your CSS       - Name …
    In this tutorial viewers will learn how to style a corner ribbon overlay for an image using CSS Create a new class by typing ".Ribbon":  Define the class' "display:" as "inline-block": Define its "position:" as "relative": Define its "overflow:" as …

    728 members asked questions and received personalized solutions in the past 7 days.

    Join the community of 500,000 technology professionals and ask your questions.

    Join & Ask a Question

    Need Help in Real-Time?

    Connect with top rated Experts

    15 Experts available now in Live!

    Get 1:1 Help Now