Форум XHTML.ru <!-- по-русски -->

Сайты - по стандартам, но не стандартные сайты!


#1 01.07.2008 12:29

Glook
Разбирающийся
Зарегистрирован: 14.01.2007
Сообщений: 142

вопрос по jQuery от начинающего

Как можно одновременно связать toggleClass и animate? Чтобы по клику менялся и класс и анимация происходила

Вообще задача такая была поставлена, задать объекту анимацию по событию (click) , а потом на второй клик повесить ту же анимацию в обратную сторону (тоесть вернуть в первичное состояние). Без анимации решалось всё просто — toggleClass. А вот как с анимацией это сделать roll

Отредактированно Glook (01.07.2008 16:39)

Нет на форуме

 

#2 01.07.2008 23:34

Octane
Опытный
Откуда: Волгоград
Зарегистрирован: 05.03.2008
Сообщений: 220
Вебсайт

Re: вопрос по jQuery от начинающего

Наверное так smile

Код:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>jQuery</title>
<script type="text/javascript" src="jquery-1.2.6.js"></script>
<script type="text/javascript">
    $(document).ready(function() {
        $('#list > li').click(function() {
            $(this).toggleClass('selected').attr('class') == 'selected' ? $(this).animate({fontSize : '30px'}) : $(this).animate({fontSize : '14px'});
        });
    });
</script>
<style type="text/css">
li {
font-size: 14px;
line-height: 36px;
cursor: pointer;
}
.selected {
background: #ffa;
}
</style>
</head>

<body>
    <ul id="list">
        <li>list item 1</li>
        <li>list item 2</li>
        <li>list item 3</li>
        <li>list item 4</li>
        <li>list item 5</li>
    </ul>
</body>
</html>

Отредактированно Octane (01.07.2008 23:45)


[url=http://code.google.com/p/js-core/]javascript framework[/url]

Нет на форуме

 

#3 09.07.2008 19:51

psy-del
Новичок
Зарегистрирован: 07.09.2007
Сообщений: 2

Re: вопрос по jQuery от начинающего

<script type='text/javascript'>
    var m = true;
    function some_f(){
        if(m == true){
            $('.some_object').animate({fome_css:300}, 300, function(){
                $(this).toggleClass('some_toggle_class');
                m = false;
            });
        }
        if(m == false){
            //Все возвращаем в исходное состояние
            m = true;
        }
    }
</script>

Нет на форуме

 

#4 09.07.2008 23:39

Octane
Опытный
Откуда: Волгоград
Зарегистрирован: 05.03.2008
Сообщений: 220
Вебсайт

Re: вопрос по jQuery от начинающего

psy-del написал:

<script type='text/javascript'>
    var m = true;
    function some_f(){
        if(m == true){
            $('.some_object').animate({fome_css:300}, 300, function(){
                $(this).toggleClass('some_toggle_class');
                m = false;
            });
        }
        if(m == false){
            //Все возвращаем в исходное состояние
            m = true;
        }
    }
</script>

ыыы)))) страсти какие lol Посоветую еще лучший способ проверки true/false:

Код:

    var m = true;
    if(m.toString().length == 4) { /* код для true */ };
    if(m.toString().length == 5) { /* код для false */ };

lol lol lol
А если серьезно, то засорять код глобальными переменными и функциями плохо wink


[url=http://code.google.com/p/js-core/]javascript framework[/url]

Нет на форуме

 

#5 17.12.2014 08:00

compac
Новичок
Зарегистрирован: 17.12.2014
Сообщений: 1

Re: вопрос по jQuery от начинающего

У меня 3-х уровневое меню с разным оформлением уровней, и наследование меня совершенно запутало...


Get fast success in [url=http://www.test-king.com/vendor-Microsoft.htm]Testking microsoft office training[/url]     and  questions by using our latest exam [url=http://www.test-king.com/vendor-ISTQB.htm]Testking istqb exam[/url]     We also offer up-to-date    [url=http://www.northeastern.edu/]northeastern[/url]

Нет на форуме

 

Board footer

Работает на PunBB
© 2002—2005 Rickard Andersson