how to change css style from jquery

my style is here

#mybox{
display:none;
}

my web is here

<div id='mybox'>
...
</div>


<script type='text/javascript'>
  $(document).ready(function(){
   $("#mybox").css("display","visible");
})
</script>

mybox don't show. How to show mybox ?

13.10.2009 10:21:00
5 ОТВЕТОВ
РЕШЕНИЕ

use $("#mybox").show() or $("#mybox").css("display","block");

5
13.10.2009 10:22:55

It is display: block in stead of display visible:

<div id='mybox'>
...
</div>


<script type='text/javascript'>
  $(document).ready(function(){
   $("#mybox").css("display","block");
})
</script>
2
13.10.2009 10:23:08
$('#mybox').show();

or

$('#mybox').slideDown();
3
13.10.2009 10:23:18

Firstly, "visible" isn't a valid value for the display attribute. Something like "block" or "inline" is. Secondly, don't set CSS directly like this. It's problematic. Instead use the jQuery effects for showing and hiding things (show/hide/toggle, slideUp/slideDown, fadeIn/fadeOut, etc):

$(function() {
  $("#mybox").show();
});

or alternatively use a class:

$(function() {
  $("#mybox").toggleClass("visible");
});

with:

div.visible { display: block; }
0
13.10.2009 10:38:52
I find it useful to have an hidden class with display: none; - this can be applied to anything. Also, I think the #mybox css rule is stronger, so I'm not sure adding a class will show it.
Kobi 13.10.2009 10:45:28

If you use the CSS with display:none; on an element you can trigger .show() and .hide() with jQuery on it! This is a jQuery default feature.

1
13.10.2009 10:35:17