1

我想使用 jquery 淡入我的文本。我已经设置了所有内容,但它似乎不起作用。也许有人可以帮助我解决这个问题?这就是我所拥有的:

.nav ul li {
opacity: 0;
padding: 0px 50px;
transition: opacity 2s ease-in; 
/* and some more transitions for other browsers */
}

.nav ul li.fade {
opacity: 1;
/* The problem is probably here: class inside of another class */
}

jQuery:

$('ul.nav li').addClass('fade');

我希望有人可以帮助我。我不知道要解决这个问题。我已经查找了一些解决方案,但我认为它们不能解决我的问题。提前致谢。编辑:我从这个网站的一个例子中得到了这个,并打算试一试。

编辑2: 小提琴

<title>title</title>
<body>
<div id='container'>
        <div id='navLeft' class='nav'>
        <ul>
        <li>link1</li>
        <li>link2</li>
        </ul>
        </div>
        <div id='logo'>
        <img src='images/logo.png' alt='logo' />
        </div>
        <div id='navRight' class='nav'>
        <ul>
        <li>link3</li>
        <li>link4</li>
        </ul>
        </div>
</div>
</body>

我的标签:

<script type='text/javascript' src='//ajax.googleapis.com/ajax/libs/jquery/2.0.0/jquery.min.js'></script>
<script type='text/javascript' src="js/class.js"></script>
4

3 回答 3

1

你是这个意思吗:

ul.nav li.fade {

而不是这个?

.nav ul li.fade {

还将第一个“.nav ul”更改为“ul.nav”

于 2013-05-18T21:49:23.613 回答
1

我想你想要

$('.nav ul li').addClass('fade');

因为.nav ul li是带有过渡属性的选择器

于 2013-05-18T21:49:38.337 回答
1

根据您的 jsFiddle 判断,您需要使用:

$('div.nav ul li').addClass('fade');

并将您的 CSS 更改为:

div.nav ul li.fade {
    opacity: 1; 
}

因为在您的 HTML 中,它<div>具有类.nav

<div id='navRight' class='nav'>

这是jsFiddle。

于 2013-05-18T22:00:21.787 回答