jQuery Link Fading.Помогите! - PullRequest
Новая
       14

jQuery Link Fading.Помогите!

0 голосов
/ 13 августа 2010

Я пытаюсь анимировать свое меню навигации с помощью эффекта затухания ссылок jQuery.Я получил скрипт из David Walsh Blog .

. Я поместил 3 тестовые ссылки прямо над моим главным меню навигации.Работает нормально, как я и ожидал.Но когда я добавляю class = "fade" к <ul id="topmenu" class="fade"> примерно так: 

<script type="text/javascript" src="jquery.dwFadingLinks.js"></script> 
<script type="text/javascript" src="jquery.effects.core.js"></script> 
<script type="text/javascript"> 
    $(document).ready(function() {
        $('.fade').dwFadingLinks({
            color: '#000',
            duration: 300
        });
     });
</script>


<body>
<div id="wrapper">
    <div id="header">
        <div id="top">
            <ul id="topmenu" class="fade">
                <li id="conor"><a href="/">Sahat Yalkabov</a></li>
                <li><?php pages(); ?></li>
            </ul>
    </div>

    <div id="content">
        <div id="main">
            <?php center(); ?>
        </div>

    </div>
    <div id="footer">
        <p>Copyright &copy; 2010 Sahat Yalkabov [ <?php login_link(); ?> ]
        </p>
    </div>
</div>
</body>
</html>

Это никак не влияет.Все еще в обычном режиме наведения CSS.

Я даже пытался добавить class="fade" к каждому элементу в теле, но по-прежнему ничего.

РЕДАКТИРОВАТЬ: навигационные ссылки генерируются PHP, как вы видите, язвонки с <li><?php pages(); ?></li>

ОБНОВЛЕНИЕ: Спасибо MvanGeest .Ваше решение решило мою проблему:).

Ответы [ 2 ]

2 голосов
/ 13 августа 2010

Ссылки, которые вы генерируете, те, которые не исчезают, не имеют атрибута класса с установленным классом .fade.

Почему бы вам не попробовать что-то вроде: 

$(document).ready(function() {
    $('div#header a').dwFadingLinks({
        color: '#000',
        duration: 300
    });
});

Имеет смысл, потому что все ссылки в заголовке должны исчезнуть в любом случае - нет необходимости устанавливать атрибут класса.

2 голосов
/ 13 августа 2010

Я думаю, что у меня есть ответ:

В javascript измените: 

$(document).ready(function() {
    $('.fade').dwFadingLinks({
        color: '#000',
        duration: 300
    });
});

на 

$(document).ready(function() {
    $('a.fade').dwFadingLinks({
        color: '#000',
        duration: 300
    });
});

и затем поместите class="fade" на фактические ссылки,:) Я сделал это в firebug и, похоже, работает.

...