onblur() not working with mozilla

Collapse
X
 
  • Time
  • Show
Clear All
new posts
  • tijo
    New Member
    • Nov 2008
    • 5

    onblur() not working with mozilla

    Hi,

    I am facing an issue with the onblur() event. The requirement is when i click a small icon in my html page a small rectangular overlay containing some text message should appear and it should disappear when I click any where else on the page.

    I have implemented the situation using java script. To bring the overaly using java script, the display property of a div is made visible and to make the same overlay hidden i have used the onblur() event.

    <div id="linker3" class="linker" onBlur="showBlu r('linker3')" > </div>
    The id linker3 is the name of the popup layer as i use 5 similar pop ups.

    class linker defines the properties of the pop up.
    Code:
    .linker{
    	background: url(Images/box.gif) no-repeat;
    	width: 128px;
    	height: 46px;
    	margin: 30px 0 0 0;
    	position: absolute;
    	z-index: 80;
    	display: none;
    }
    function showBlur(id){
    var box=document.ge tElementById(id );
    box.style.displ ay='none';
    }



    This is working fine for IE6 but not for mozilla. Could you please help
  • shane3341436
    New Member
    • Mar 2007
    • 63

    #2
    Did you check what error appears in the firefox error console?

    Comment

    • tijo
      New Member
      • Nov 2008
      • 5

      #3
      No error is shown in the error console. Is the issue due to the fact that mozilla doesn;t recognize onblur() event.

      Comment

      • shane3341436
        New Member
        • Mar 2007
        • 63

        #4
        Firfox do recognize onblur function. Though, make sure that if the function is being called or not, something like inserting alert() inside the function.

        Comment

        • tijo
          New Member
          • Nov 2008
          • 5

          #5
          Hi,

          When i repalced the onblur event with ondblclick(), it worked fine for both IE and Mozilla, ie the overlay div was made dispaly none uisng the same script.

          <div id="linker2" class="linker" ondblclick="sho wBlur('linker2' )" > </div>

          When If repalced it with onblur(), IE alone recognizes

          Do you know any other way to meet this requirement

          Comment

          • shane3341436
            New Member
            • Mar 2007
            • 63

            #6
            Another way may be using the javascript timer functions.After some time interval you can hide the popup.

            Comment

            • tijo
              New Member
              • Nov 2008
              • 5

              #7
              No That cannot be done in this application. This pop up should be closed only when a click is made some where else on the page. Can you suggest a method.

              Comment

              • shane3341436
                New Member
                • Mar 2007
                • 63

                #8
                what about onmouseout() function?

                Comment

                • tijo
                  New Member
                  • Nov 2008
                  • 5

                  #9
                  Sorry,

                  The client requires a click outside that div to close the popup

                  Comment

                  • shane3341436
                    New Member
                    • Mar 2007
                    • 63

                    #10
                    then use the onclick event of the body element. There seems a real problem with onblur event in the 'div' for the firefox.
                    Or there is a tricky way to force input element behave like div. The onblur method works fine in input elements.

                    Comment

                    • acoder
                      Recognized Expert MVP
                      • Nov 2006
                      • 16032

                      #11
                      That's correct. Firefox doesn't support onblur for divs. See notes on this ref. page. This is correct behaviour - see supported events for div and span.

                      The workaround is to use onclick on the document and check that the div is not the target.

                      Comment

                      Working...