SitePoint Sponsor

User Tag List

Results 1 to 7 of 7
  1. #1
    SitePoint Zealot Offspring2099's Avatar
    Join Date
    May 2005
    Location
    Los Angeles, CA
    Posts
    182
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Question object.style.left assigment makes my hidden div visible

    Hello,

    I'm getting very frustrated with this bug. Is there any reason why a hidden div would flash visible for a slight millisecond when I set object.style.left|top for the first time? Only on Firefox. This is killing me. Here is an example -> http://www.huskercrazy.com/ Just hit the first comments link. Any ideas? Thank you in advance.

  2. #2
    SitePoint Zealot Offspring2099's Avatar
    Join Date
    May 2005
    Location
    Los Angeles, CA
    Posts
    182
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    HTML Code:
    	<script type="text/javascript">
    		function getComments(){
    			var someDiv 	= document.getElementById('someDiv');
    			for(var i=0;i<1000;i++) {
    				someDiv.style.left= "100px";
    				someDiv.style.top = "100px";
    			}
    		
    		}
    	</script>
    
    
    	<div id='someDiv' style="width: 540px; height: 300px;  overflow-x: hidden; visibility:hidden;  position:absolute; " ></div>
    	<a onclick="javascript:getComments()" >Click Me</a>
    Using Firefox (my versions are 2.0.0.3 and 2.0.0.14). If you load this and then click 'Click Me', you will notice the hidden div appear for a slight second, with image of 'Click Me'. It doesn't happen every time. So I just do hard refresh and hit it again. It will "flash" once every 20-30 attempts.

  3. #3
    SitePoint Wizard
    Join Date
    Nov 2004
    Location
    Nelson BC
    Posts
    2,310
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Maybe include an initial top and left value in the style attribute of your div - see if that helps.

  4. #4
    I meant that to happen silver trophybronze trophy Raffles's Avatar
    Join Date
    Sep 2005
    Location
    Tanzania
    Posts
    4,662
    Mentioned
    2 Post(s)
    Tagged
    0 Thread(s)
    Also try display:none instead of visibility:hidden, and when you show it, change the display value right at the end of whatever else you're doing with it.

  5. #5
    SitePoint Zealot Offspring2099's Avatar
    Join Date
    May 2005
    Location
    Los Angeles, CA
    Posts
    182
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Thanks guys.

    Display:none worked. Why is that?

  6. #6
    I meant that to happen silver trophybronze trophy Raffles's Avatar
    Join Date
    Sep 2005
    Location
    Tanzania
    Posts
    4,662
    Mentioned
    2 Post(s)
    Tagged
    0 Thread(s)
    Some browsers can be funny about visibility:hidden, or perhaps there was a conflict elsewhere? By the way, you should be consistent with your use of quotes in HTML attributes:
    Code:
    <div id='someDiv' style="width: 540px; height: 300px;">
    turn into:
    Code:
    <div id="someDiv" style="width: 540px; height: 300px;">

  7. #7
    SitePoint Zealot Offspring2099's Avatar
    Join Date
    May 2005
    Location
    Los Angeles, CA
    Posts
    182
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I see, Thanks.
    ***
    It's a nasty habit that I'm trying to kick.

    Quote Originally Posted by Raffles View Post
    Some browsers can be funny about visibility:hidden, or perhaps there was a conflict elsewhere? By the way, you should be consistent with your use of quotes in HTML attributes:
    Code:
    <div id='someDiv' style="width: 540px; height: 300px;">
    turn into:
    Code:
    <div id="someDiv" style="width: 540px; height: 300px;">


Bookmarks

Posting Permissions

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