animate({display:'list-item'})不起作用？该怎么解决 _JavaScript

animate({display:'list-item'})不起作用？



<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html>

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<link rel="stylesheet" href="css/default.css" type="text/css" />

<script src="jquery-1.9.1.js"></script>

<script src="sample.js"></script>

<script>

	$(document).ready(function() {

		$('li').animate({display:'list-item'});

	});

</script>

<style>

	li {

		display: none;

	}

</style>

</head>

<body>

<ul>

	<li>sohu</li>

	<li>sina</li>

	<li>163</li>

</ul>

</body>

</html>

这段代码运行后，li还是没显示，请问这是为啥？
把animate那行改成show()倒是能显示出来，但是我这里只能用animate的。。。

------解决方案--------------------

引用:

这段代码运行后，li还是没显示，请问这是为啥？
把animate那行改成show()倒是能显示出来，但是我这里只能用animate的。。。

CSS的初始设置是不显示的。另外，每有看到jquery 的说明文档里面可以，动画 display 属性。
http://api.jquery.com/animate/



<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html>

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<link rel="stylesheet" href="css/default.css" type="text/css" />

<script src="scripts/jquery-2.0.2.js"></script>

    <script type="text/javascript">

        $(document).ready(function () {

            $('li').animate({

                width: "70%",

                opacity: 0.4,

                marginLeft: "0.6in",