Блог

Главная - Вопросы по программированию - Переключение анимированных ссылок

Переключение анимированных ссылок

#jquery #toggle #hyperlink

#jquery #переключение #гиперссылка

Вопрос:

Я хочу переключать ширину ссылок в следующем коде. Это работает, но я хочу, чтобы ширина возвращалась, когда я нажимаю на другую ссылку, тем самым оставаясь с одной расширенной ссылкой, я надеюсь, что это имеет смысл.

 <!DOCTYPE>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<script type="text/javascript" src="jquery-1.4.2.min.js"></script> 
<script type="text/javascript">         
    $(document).ready(function () {

    //animate links
    $(".nav_links li a.link").toggle(function(){
        $(this).animate({width:237},200);
    },function(){
        $(this).animate({width:72},200);
    });



    });
</script>
</head>

<body>
<ul>
        <li><a href="#" class="about link"></a></li>
many other links here
        </ul>
</body>
</html>

Ответ №1:

Я бы не стал использовать toggle для этого, потому что он хорош для одной вещи — включения / выключения отдельно выбранного элемента / группы. То, что вы пытаетесь сделать, это сбросить другие элементы при включении одного. Попробуйте что-то подобное вместо этого: 

 $(".nav_links li a.link").click(function(){
    // Reset all links.
    $(".nav_links li a.link").animate({width:72},200);

    // Set currently clicked on as necessary.
    $(this).animate({width:237},200);
});

Комментарии:

1. Кон! Да будете вы жить вечно! Вы только что спасли душу!