www.webdeveloper.com
Results 1 to 5 of 5

Thread: Unwanted Cursor Change

  1. #1
    Join Date
    Mar 2010
    Posts
    8

    Unwanted Cursor Change

    EXAMPLE CODE:
    Code:
    <html>
    
    <div id="myDiv"><img src=http://example.com/a.jpg></div>
    
    <p>
    
    <button style="cursor:pointer" onClick="myDiv.innerHTML='<img src=http://example.com/b.jpg>'">TEST</button>
    
    </html>
    SUMMARY:

    My example code causes the following problem in Internet Explorer (at least, in version 6): it causes an unwanted cursor change when the button is clicked.

    DETAILS:

    Using my example code, here is what happens (step-by-step in chronological order): (1) the user hovers the mouse over the button, which causes the cursor to be a hand; (2) the user clicks the button; (3) the browser does its image-related activity; (4) immediately after step 3 is entirely completed (in other words, after the browser finishes loading an available image or after the browser times out from attempting to find an unavailable image), the cursor changes from a hand to an arrow if the mouse is kept still; (5) if the mouse is then moved while staying over the button, the cursor will change back to a hand.

    As I said, in step 4, the cursor changes from a hand to an arrow if the mouse is kept still. I consider that to be a problem because I want the cursor to *always* be a hand when it is over the button. And, indeed, that should be the expected behavior due to the CSS code (style="cursor:pointer") in the button tag.

    QUESTION #1:

    The problem occurs in IE6, which is the only version of IE available to me. Does the problem also occur in later versions of IE? (The problem does not occur in Firefox.)

    QUESTION #2:

    How can I fix the problem?

    NOTE:

    When attempting to replicate the problem, make sure you use full Internet URLs (for example, "http://example.com/a.jpg") in your code. If you use relative paths or local paths, you may not be able to replicate the problem.

  2. #2
    Join Date
    May 2006
    Location
    Somewhere behind your screen
    Posts
    1,653
    IE7 doesn't do this trick. it seems IE6 set focus on the new image that's why the button cursor turns into an arrow. i'd try to return the focus onto the button through image onload or just fire blur() for the new image. but is it so important? ;-))

  3. #3
    Join Date
    Jul 2008
    Location
    urbana, il
    Posts
    2,787
    Code:
    <button style="cursor:pointer" onClick="myDiv.innerHTML='<img tabindex=-1 src=http://example.com/b.jpg>'">TEST</button>

  4. #4
    Join Date
    Mar 2010
    Posts
    8
    Padonak and rnd_me: I tested your suggestions in IE6; they do not fix the problem.

  5. #5
    Join Date
    Mar 2010
    Posts
    8
    I would like to get some more feedback to find out if the problem (described in my original post) occurs in versions of IE that are later than version 6. Please post your results.

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
HTML5 Development Center



Recent Articles